将函数放入Array会使其父函数混乱

Question

我想在节点中创建一个类，该类运行一组可以轻松添加或删除的阶段。我当前的代码如下：

function MyClass(){
this._stages = [this.function1, this.function2];
this._info = {'a':'special object info'};
};
MyClass.prototype.run = function(){
for(var i = 0; i<this._stages.length; i++){
this._stages[i]();
}
};
MyClass.prototype.function1 = function(){
this.subfunction1();
};
MyClass.prototype.subfunction1 = function(){};

不幸的是，似乎把函数放在Array中会把它们的"父"搞砸，我得到一个错误，说

TypeError: Object function (query) {
[...long list of elements]
} has no method 'subfunction1'
at Array.MyClass.function1...

有没有一种方法可以在不发生这种情况的情况下通过阶段执行来实现这一点？

谢谢！

Answer 1

当您将其放入数组中时，它将失去与this的关联。因此，当您调用这些函数时，它们将没有正确的this值。你可以用.bind():修复它

function MyClass(){
this._stages = [this.function1.bind(this), this.function2.bind(this)];
this._info = {'a':'special object info'};
};

---

修复它的另一种方法是，当您使用.call()专门设置this指针来调用函数时，重新附加this，如下所示：

MyClass.prototype.run = function(){
for(var i = 0; i<this._stages.length; i++){
this._stages[i].call(this);
}
};

---

作为一种解释，当你这样做时：

var x = this.function1;
x();

那么，x变量中的所有内容都是指向function1函数的指针。如果调用x()，它将在没有任何对象引用的情况下被调用，因此如果在严格模式下运行，函数中的this将是全局对象或undefined。它将不是所需的对象。

.bind()创建一个存储this值的存根函数，然后用正确的对象引用调用原始函数，从而正确设置this值。

如果你想了解this是如何设置的，你可以看到这个答案：当你通过'；这'；作为自变量