Question

我是Java语言的新手。现在，我试图了解Closure。在最常见的情况下，它很容易理解。但是仍然有一些令人困惑的地方。 这可能是关于JavaScript中的this的问题。我不确定。

这里有3个示例： 1：

var name = "The Window";

var object = {
  name: "My Object",
  getNameFunc: function() {
    return this.name;
  }
};

console.log(object.getNameFunc()); // 'My Object'

2：

var name = "The Window";

var object = {
  name: "My Object",
  getNameFunc: function() {
    return function() {
      return this.name;
    };
  }
};

console.log(object.getNameFunc()()); // 'The Window'

最后一个：

var name = "The Window";

var object = {
  name: "My Object",
  getNameFunc: function() {
    var that = this;
    return function() {
      return that.name;
    };
  }
};

console.log(object.getNameFunc()()); // 'My Object'

第一个很容易理解。但是为什么第二个人返回The Window而第三个人返回My Object。

Answer 1

this是一个特殊的关键字，而不是普通变量，并且不会保存在闭包中。因此，在第二版中，内部闭包不使用this收到的getNameFunc()的值，它默认为全局值，即Window对象。

第三个版本有效，因为that是普通变量，因此保留在闭包中。

您可以像这样绑定函数：

var name = "The Window";

var object = {
  name: "My Object",
  getNameFunc: function() {
    return (function() {
      return this.name;
    }).bind(this);
  }
};

console.log(object.getNameFunc()()); // 'The Window'

或使用箭头功能：

var name = "The Window";

var object = {
  name: "My Object",
  getNameFunc: function() {
    return () => this.name;
  }
};

console.log(object.getNameFunc()()); // 'The Window'

有关更多信息，请参见How to access the correct `this` inside a callback?

仍然使Javascript与示例混淆

1 个答案: