这是类函数内的窗口[重复]答案

【问题标题】：this is window inside the function of a class [duplicate]这是类函数内的窗口[重复]
【发布时间】：2021-04-21 11:48:25
【问题描述】：

我这里有一些代码。我知道这个引用不会在匿名函数中进行。但是这里，即使使用对象的函数，里面的this也就是window。

var MyClass = function (div) {

    this.array = [];
};

MyClass.prototype = {
  addToArray: function (elem) {
    this.array.push(elem);
  },
  processAndAdd: function(elemArray){
    elemArray.forEach(this.addToArray);
  }
}

var myObj = new MyClass();
myObj.processAndAdd([1, 2, 3]);
console.log('test');

错误：行：this.array.push(elem);

未定义的推送。

经过检查，这里是窗口对象

我想知道为什么这里是窗口，以及如何重组我的代码以正确处理这个问题。

【问题讨论】：

当您将函数引用传递给forEach 时，它会丢失其this，因为它不再在this 上被调用（即：myObj）。 .forEach() 方法允许您为回调指定 this：.forEach(this.addToArray, this)

标签： javascript class this prototype

【解决方案1】：

在将回调函数体作为回调传递给forEach 后，对this 对象的引用不再是MyClass 构造函数。将函数体与当前 this 上下文绑定，您的代码应该可以工作。

    var MyClass = function (div) {
    
        this.array = [];
    };
    
    MyClass.prototype = {
      addToArray: function (elem) {
        this.array.push(elem);
      },
      processAndAdd: function(elemArray){
        elemArray.forEach(this.addToArray.bind(this));
      }
    }
    
    var myObj = new MyClass();
    myObj.processAndAdd([1, 2, 3]);
    console.log('test');

【讨论】：

bind 的问题是它会创建一个新函数，对吧？这部分代码会被调用多次，我希望它尽可能高效。我认为尼克的评论可能更适合我。我可以将上下文传递给 foreach。