箭头函数中的this

1. 箭头函数中的this

   • 箭头函数中的this绑定的是上下文的this对象，如下：

   var calculate = {
     array: [1, 2, 3],
     sum: () => {
       console.log(this === window);
       return this.array.reduce((a, b) => a*b);
     }
   };
   console.log(this === window);
   calculate.sum();
   

   • 这里会报错TypeError，因为this.array绑定的其实是window.array，但是在window的对象里并没有找到array，所以就会报错。
   • 解决方法是使用函数表达式或者方法定义的短语法。这种情况下，this决定于调用的对象，而不是上下文。

   var calculate = {
     array: [1, 2, 3],
     sum() {
       console.log(this === calculate);
       return this.array.reduce((a, b) => a*b);
     }
   };
   console.log(this === window);
   calculate.sum();
   

   • 这里在sum中的this指向calculate，所以在

2. 结合动态上下文的回调函数

   • this在js中是一个很强大的特性，它允许利用函数调用的方式改变上下文。但是在箭头函数的使用过程中，在函数声明的时候就会绑定静态的上下文，之后并不会动态的改变。所以在使用回调函数的时候，要使用函数表达式。

3. 调用构造器

   • 构造器函数不能箭头函数，this在获取上下文对象时会出现问题。