Question

当我尝试将简单的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))

以上所有内容都按预期顺利运行。

但是一旦我开始使用const和箭头功能等ES6功能，就像这样：

const obj = {num: 2}

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

它不再起作用并抛出错误：无法读取属性＆＃39; num＆＃39;未定义的。

有人可以解释为什么this不再有效吗？

Answer 1

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

所以“this”指的是父语境。如果没有'num'变量，那么它是未定义的。

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

箭头函数使用call，apply，bind - 不工作？

1 个答案: