前言
在react开发中,经常使用bind(this),来将函数绑定上下文,后来使用了箭头函数,就不需要使用bind(this)了。在非箭头函数下, this 指向调用其所在函数的对象,而且是离谁近就是指向谁(此对于常规对象,原型链, getter & setter等都适用);构造函数下,this与被创建的新对象绑定;DOM事件,this指向触发事件的元素;内联事件分两种情况,bind绑定, call & apply 方法等, 容以下一步一步讨论。箭头函数也会穿插其中进行讨论。关于this指针的问题可以看下这里。
bind 方法
bind方法在ES5引入, 在Function的原型链上, Function.prototype.bind 。通过bind方法绑定后, 函数将被永远绑定在其第一个参数对象上, 而无论其在什么情况下被调用。
1 function f(){ 2 return this.a; 3 } 4 5 var g = f.bind({a:"azerty"}); 6 console.log(g()); // azerty 7 8 var o = {a:37, f:f, g:g}; 9 console.log(o.f(), o.g()); // 37, azerty
箭头函数中的 this
箭头函数this指针是在定义的时候绑定的,不管在什么上下文环境中,他的指向是其定义时的指向。而普通的函数this指针是在运行的时候进行绑定的,它的指向为当前上下文环境因此是不确定的。