ES6箭头函数和this上下文

Question

我已经阅读了一些有关箭头函数的主题，但以下代码仍然让我感到困惑。

var bunny = {
  name: 'Usagi',
  tasks: ['transform', 'eat cake', 'blow kisses'],
  first : () => {
    console.log(this) //does not refer to bunny
  },
  second: function(){
    console.log(this) //refers to bunny
  },
  third() {
    this.tasks.forEach((task) => {
      console.log(this); //refers to bunny
    });
  }
};

bunny.first();
bunny.second();
bunny.third();

有人能告诉我为什么第三个函数的内部函数中this指向当前对象，而第一个函数不是吗？难道我们使用箭头函数时，this指的是定义它的当前作用域吗？

- Shane

---

箭头函数在其自身的词法作用域中不定义 this，因此它从其外部作用域获取它，就像它会获取一个未在自身内定义的普通变量一样。 - user1106925

对象字面量中属性表达式内的当前this上下文不是构造的对象。 - Bergi

请看箭头函数与函数声明/表达式：它们是等效的/可互换吗？。 - Felix Kling

Answer 1

箭头函数与function语句或函数基本等价，唯一的区别是它们将this参数绑定到父级作用域。

换句话说，如果箭头函数出现在顶层作用域中，则其this参数将始终引用全局作用域（例如浏览器中的window或node.js中的global），而在常规函数内部的箭头函数将具有与其外部函数相同的this参数，正如您的代码演示的那样。

- Frxstrem

---

外部函数不是forEach吗？并且它附加的this的值不是this.tasks吗？有人能给一个更逐步的解释吗？ - Irina