javascript - 从 setTimeout() 内部调用 this._super()

Question

我们使用 John Resig 的 inherit.js。这让我们可以访问方便的 _super() 函数来调用父函数。太棒了，但今天我被一个问题难住了，我无法从 setTimeout 中调用 this._super()，即使我绑定(bind)了这个:

代码示例

var Person = Class.extend({
  init: function(isDancing){
  this.dancing = isDancing;
},
    dance: function(){
        return this.dancing;
    }
});

var Ninja = Person.extend({
    init: function(){
        this._super( false );
},
dance: function(){
    window.setTimeout(function(){
        // Call the inherited version of dance()
        return this._super();
    }.bind(this),50);
});

this._super() 未定义!这是怎么回事？

Answer 1

要完成这项工作，您需要在子类方法中捕获 _super 方法，如下所示:

dance: function(){
    // capture the super method for later usage
    var superMethod = this._super;
    window.setTimeout(function(){
        return superMethod();
    },50);
};

这行得通而您的代码行不通的原因是 inherit.js 中的 extend() 方法捕获了父类(super class)'方法作为 this._super 就在你覆盖的方法运行之前。然后它运行你的代码，在你的代码完成之后运行它会将 _super 恢复到它运行之前设置的任何值。该操作发生在以下来自 inherit.js 的代码中

      var tmp = this._super;

      // Add a new ._super() method that is the same method
      // but on the super-class
      this._super = _super[name];

      // The method only need to be bound temporarily, so we
      // remove it when we're done executing
      var ret = fn.apply(this, arguments);        
      this._super = tmp;

      return ret;

所以更具体地说;当运行原始代码时，用作 setTimeout 参数的函数绑定(bind)到原始对象。它不起作用的原因是，即使 this 引用了正确的对象，this._super 引用了其他东西，因为 this._super 是重置为指向它在运行该方法之前指向的任何内容。可能它没有被设置，所以 this._super 的值很可能只是 undefined。