JS的this关键字

最新推荐文章于 2024-03-13 17:00:09 发布

IT农夫

最新推荐文章于 2024-03-13 17:00:09 发布

阅读量3.4k

点赞数

分类专栏： WEBUI

本文链接：https://blog.csdn.net/kkdelta/article/details/8457358

版权

WEBUI 专栏收录该内容

32 篇文章 0 订阅

订阅专栏

JavaScript中的this关键字是一个难以琢磨的概念，是一个依赖于它的执行环境而被解析的关键字。简单说就是谁调用这个方法，方法里的this就是谁.

1,在JS文件中直接alert(this);this代表的是window,当前的执行环境是在JS的顶层域里面。

2，下面这个例子中this指向的是调用该方法的对象，button标签。

<script type="text/javascript">
	function test() {
		alert(this.value);
		this.style.color = "red";
	}
</script>

</head>
<body>
	<input type="button"  id="ipt" value="test this">
	<script type="text/javascript">
		document.getElementById("ipt").onclick = test;
	</script>
</body>
</html>

上面的例子等价于下面的例子，document.getElementById("ipt").onclick相对于把test函数变成了id为 ipt元素的一个函数属性了，从而让this指向了id为 ipt元素。但是如果写成<input type="button" id="ipt" οnclick="test()" value="test this">这样的方式调用test方法，this却是指向了window。（不明白？直接指定的话没有JS环境绑定？）

<script type="text/javascript">
	function test() {
		alert(this.value);
		this.style.color = "red";
	}
</script>

</head>
<body>
	<input type="button"  id="ipt" value="test this">
	<script type="text/javascript">
		var button = document.getElementById("ipt");
		test.call(button);
	</script>
</body>
</html>

3，在一个函数中，this代表这个函数的执行环境

function Test(){
	alert(this);
}

Test();//outputs window

var obj = new Test(); // outputs object

Test()是在window域里执行的，其等价于window.Test();
var obj = new Test(); 其相当于 obj.Test();

IT农夫

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS的this关键字

JavaScript中的this关键字是一个难以琢磨的概念，是一个依赖于它的执行环境而被解析的关键字。1,在JS文件中直接alert(this);this代表的是window,当前的执行环境是在JS的顶层域里面。2，下面这个例子中this指向的是调用该方法的对象，button标签。 function test() { alert(this.value); this.sty
复制链接

扫一扫

专栏目录