箭头函数的值

Question

我正在尝试理解ECMAScript 6中的箭头功能。

这是我在阅读时遇到的定义：

  

箭头函数具有隐式this绑定，这意味着   箭头函数内的this值的值远离   与箭头函数范围内this的值相同   定义了！

根据定义，我认为this的{​​{1}}应该包含与定义箭头函数相同的块级别值。

代码：

arrow function

但是，我从代码中得到了这个结果

var test = {
  id: "123123",
  k: {
    laptop: "ramen",
    testfunc: () => console.log(this)
  }
}

console.log(test.k.testfunc);

我认为我会得到的结果是：

function testfunc() {
    return console.log(undefined);
}

如果我跑这个

{"laptop": "ramen"}

Answer 1

让我们转换为等效的ES5代码：

var test = {
  id: "123123",
  k: {
    laptop: "ramen",
    testfunc: function(){return console.log(this)}.bind(this)
  }
}

请记住，this取决于您调用该函数的如何。外部this不在函数内部，因此在严格模式下默认为undefined。

以下简化方案：

console.log(this) // undefined

var test = {
  a: this // same `this` as above
}

Answer 2

您在定义var test的同一范围内定义箭头功能。如果您在全局范围内定义test，那么箭头函数的上下文也将是全局范围。

如果要在方法内定义测试，则箭头函数将共享方法的上下文。

function method() {
  const self = this;

  const test = {
    foo: () => console.log(self === this);
  }

  test.foo()
  // console: true
}