使用调用、应用、绑定的箭头函数 - 不起作用？ [复制]答案

【问题标题】：Arrow functions using call, apply, bind - not working? [duplicate]使用调用、应用、绑定的箭头函数 - 不起作用？ [复制]
【发布时间】：2017-09-20 10:14:22
【问题描述】：

当我尝试将简单的 ES5 代码转换为 ES6 时，我有点困惑。

假设我有这段代码：

var obj = {num: 2}

var addToThis = function (a, b, c) {
  return this.num + a + b + c
}

// call
console.log(addToThis.call(obj, 1, 2, 3))

// apply
const arr = [1, 2, 3]
console.log(addToThis.apply(obj, arr))

// bind
const bound = addToThis.bind(obj)
console.log(bound(1, 2, 3))

上面的一切都按预期顺利运行。

但是一旦我开始使用 ES6 的特性，比如 const 和箭头函数，就像这样：

const obj = {num: 2}

const addToThis = (a, b, c) => {
  return this.num + a + b + c
}

它不再起作用并引发错误：无法读取未定义的属性“num”。

有人可以解释为什么this 不再起作用了吗？

【问题讨论】：

嘿@angular_learner 你在这里得到了你问题的必要答案吗？如果否，请指出，其他人更容易提供更详细的答案，如果是，请标记为已接受。对很多人都有帮助
答案不充分

标签： javascript binding ecmascript-6 this

【解决方案1】：

Lambda 函数（箭头函数）不会创建新的函数上下文并使用调用函数的上下文。

所以“this”指的是父上下文。如果没有 'num' 变量，则它是未定义的。

通常它真的很方便，因为大多数时候您使用一个上下文而不是在您创建的每个函数中创建一个新上下文。在我看来 call/apply/bind 完全令人困惑，而 lambda 函数使它变得不必要。

【讨论】：