Question

在使用箭头函数调用函数时，我对this的值非常困惑。让我们举个例子：

var obj = {
  property: 5,
  func1: function () {
    console.log(this.property);
  },
  func2: () => {
    console.log(this.property);
  }
}

当我将此代码放在浏览器控制台上时，会发生一件有趣的事情，func1()会按预期输出5 *，但是当我运行func2时我得到了undefined。这里发生了什么？为什么this内func2的值引用了全局对象（在这种情况下为Window）。

我认为我期望输出，因为它是如何工作的，这就是Alan和slevetman分别解释here和here的原因。但根据the Jason's explanation

箭头功能没有自己的这个值。箭头函数中的this值始终从封闭范围继承。

那么，为什么func2内部的值不会继承其封闭范围obj的值？

Answer 1

那么，为什么func2内部的值不会继承其封闭范围obj的值？

obj这里不是＆＃34;封闭＆＃34;范围。您定义obj的范围是＆＃34;封闭＆＃34;范围。

考虑这个例子：

var obj = {
  property: 5,
  func1: function () {
      let func2 = () => {
        console.log(this.property); 
      }
      func2();
  },
}
obj.func1(); // logs 5
obj.func1.call({
   property: 6
}) // logs 6

当调用内部func2时，this关键字引用obj为this，因为包装func1函数中的obj引用{{1}并且func2 继承 this值。内部箭头功能不会绑定它自己的this值。

Answer 2

this中的func2继承了函数本身范围的值，不再存在。为了使其有效，你必须做出类似的事情：

var obj = {
    property: 5,
    func1: function () {
        console.log(this.property); // shows 5
    },
    func2: () => {
        console.log(this.property); // shows undefined
        this.property = 6;
        console.log(this.property); // shows 6
    }
}

这个内部对象方法的值？

2 个答案: