JavaScript 中的 this

[swiftwind0405]

---

什么是this

this 不是在编写时候绑定的，而是在运行时候绑定的上下文执行环境。this 绑定和函数申明无关，反而和函数被调用的方式有关系。

当一个函数被调用的时候，会建立一个活动记录，也成为执行环境。这个记录包含函数是从何处（call-stack）被调用的，函数是 如何 被调用的，被传递了什么参数等信息。这个记录的属性之一，就是在函数执行期间将被使用的 this 引用。

四种绑定方式

函数调用

this 默认绑定

严格模式下，this 绑定到 underfined，否则绑定到全局对象。

方法调用

this 隐式绑定

当一个函数被调用的时候，会建立一个活动记录，也成为执行环境。这个记录包含函数是从何处（call-stack）被调用的，函数是 如何 被调用的，被传递了什么参数等信息。这个记录的属性之一，就是在函数执行期间将被使用的 this 引用。

函数中的 this 是多变的，但是规则是不变的。一般情况下，this不是在编译的时候决定的，而是在运行的时候绑定的上下文执行环境。this 与声明无关。

隐式绑定丢失

隐式丢失其实就是被隐式绑定的函数在特定的情况下会丢失绑定对象。

有两种情况容易发生隐式丢失问题：

• 使用另一个变量来给函数取别名
• 将函数作为参数传递时会被隐式赋值，回调函数丢失 this 绑定

如果把一个函数当成参数传递到另一个函数的时候，也会发生隐式丢失的问题，且与包裹着它的函数的 this 指向无关。在非严格模式下，会把该函数的 this 绑定到 window 上，严格模式下绑定到 undefined。

构造函数调用

this 绑定的是新创建的对象

类通常包含一个 constructor ， this 可以指向任何新创建的对象。

间接调用

强绑定，显示绑定，直接更改 this 的指向

• this 永远指向最后调用它的那个对象
• 匿名函数的 this 永远指向 window
• 使用 .call() 或者 .apply() 的函数是会直接执行的
• bind() 是创建一个新的函数，需要手动调用才会执行
• 如果 call、apply、bind 接收到的第一个参数是空或者 null、undefined 的话，则会忽略这个参数
• forEach、map、filter 函数的第二个参数也是能显式绑定 this 的

优先级：new绑定 > 显式绑定 > 隐式绑定 > 默认绑定

箭头函数

箭头函数中没有 this 绑定，必须通过查找作用域链来决定其值，如果箭头函数被非箭头函数包含，则 this 绑定的是最近一层非箭头函数的 this，否则，this 为 undefined。

此外，使用 call 、 apply 或 bind 等方法给 this 传值，箭头函数会忽略。箭头函数引用的是箭头函数在创建时设置的 this 值。

一些特殊情况下的this

DOM �事件函数

一般指向绑定事件的 DOM 元素，但有些情况绑定到全局对象，比如 IE6-8 的 attachEvent。
例如：

document.body.addEventListener('click', fn, false);

function fn(e) {
	console.log(this === e.currentTarget);
}

参考资料

• 彻底明白this指向
• 嗨，你真的懂this吗？
• 【THE LAST TIME】this：call、apply、bind
  
• 再来40道this面试题酸爽继续