this指向问题

最新推荐文章于 2023-09-07 15:51:39 发布

zhoutingxixi

最新推荐文章于 2023-09-07 15:51:39 发布

阅读量123

点赞数

文章标签： js

本文链接：https://blog.csdn.net/weixin_43844696/article/details/105252431

版权

this 指代哪个对象？

1. 通常在函数中的 this 指向的是调用函数的那个对象(谁调用指向谁)
           2. 事件函数中的 this 通常指向的是绑定事件的事件源元素
           3. 构造函数中的 this ，（使用 new 调用构造函数创建对象），通常指向的是 new 所创建出来的对象本身
           4. 全局范围的 this 通常指向的是全局对象（浏览器中是 window）

注意：this的指向不是在创建时就决定了，而是由执行环境决定的。

全局环境 setTimeout setInterval this指向window对象

var name = 'zhangsan';
function Demo(){
  console.log(this.name);//zhangsan
}
Demo();

var name = 'zhangsan';
setTimeout(function(){
  console.log(this.name);//zhangsan
},0);

对象环境指向对象

（1）、指向对象

var obj = {
  name : "zhangsan",
  demo: function(){
    console.log(this.name);//输出zhangsan
  }
}
obj.demo();

（2）、经典例子

var name = 'lisi';
var obj = {
  name : "zhangsan",
  demo: function(){
    console.log(this.name);//此时this指向window f1()调用
  }
}
var f1= obj.demo;
f1();//输出 lisi
//在这里，f1定义在全局环境下，即window.f1() 说明了this的指向是由运行时的执行环境来决定的

var name = 'lisi';
var obj = {
  name : "zhangsan",
  demo: function(){
    return function(){
      console.log(this.name);
    }
  }
}
obj.demo();//输出 ƒ (){console.log(this.name);}
obj.demo()();//输出 lisi 在window下调用 所以 指向window

修改 this 指向 bind call appy

<script>
	function test2() {
		console.log("test2");
		console.log(this);
	}

	test2();// test2 window
	test2.call(document.body);// test2 <body></body> 
	test2.apply(document)// test2 #document
</script>

bind call appy参数

<script>
	function add(num1, num2) {
		console.log(num1 + num2);
		console.log(this)
	}
	add(5,7)// 12 window
	add.apply(document.body, [5, 7])// 12 <body></body>
	add.call(document, 5, 7);// 12 #document
</script>

zhoutingxixi

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
this指向问题

this 指代哪个对象？ 1. 通常在函数中的 this 指向的是调用函数的那个对象(谁调用指向谁) 2. 事件函数中的 this 通常指向的是绑定事件的事件源元素 3. 构造函数中的 this ，（使用 new 调用构造函数创建对象），通常指向的是 new 所创建出来的对象本身 4. 全局范围的 t...
复制链接

扫一扫