js中的this是个很妙的东西,你经常不知道它到底在指向谁,又是谁在调用它。
通用判断方法:
1.this总是指向它的直接调用者
<pre style="margin: 0px; padding: 0px; white-space: pre-wrap; word-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;">var a={
user:'Artimis',
fn:function(){
console.log(this.user)
}
} a.fn() //Artimis => this指向a
var b=a.fn;
b() //undefined => this指向window</pre>
2.如果没有找到直接调用者,则this指向window
<pre style="margin: 0px; padding: 0px; white-space: pre-wrap; word-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;">function fn(){
var user='Artimis';
console.log(this.user)
}
fn() //undefined => this指向window</pre>
3.遇到return,如果返回的是对象,则this指向返回对象,否则指向函数实例
<pre style="margin: 0px; padding: 0px; white-space: pre-wrap; word-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;">function A(){
this.user='Artimis';
return {} //return一个空对象
} var a=new A();
console.log(a.user) //undefined => this指向return的{}
function B(){
this.user='Artimis';
return 1 //return一个数值
} var b=new B();
console.log(b.user) //Artimis => this指向b</pre>
4.使用call/apply/bind绑定的,this指向绑定对象
5.定时器(匿名函数)内没有默认的宿主对象,所以this指向window
6.箭头函数内部没有this,this指向外层最近的调用者
1> 箭头函数在调用时,不会生成自身作用域下的this和arguments
2> 不像普通函数一样在调用时自动获取this,而是沿着作用域链向上查找,找到最近的外部一层作用域的this,并获取
3> 在定义对象的方法/具有动态上下文的回调函数/构造函数中都不适用