javascript - Class.create 和 this 关键字

Question

我正在尝试使用 prototype.js 的 Class 方法来管理我当前项目的对象层次结构，但是我在使用 this 关键字时遇到了一些问题与 Class.create 的连词。

这是一段老式的纯js代码来创建继承:

var Super1 = function () {
    this.fu = "bar";
}

var Sub1 = function () {
    this.baz = "bat";
    this.f = function (e) {
        alert("Sub1:"+this.fu+this.baz);
    }.bindAsEventListener(this);
    document.observe("click", this.f);
};
Sub1.prototype = new Super1();
new Sub1();

这是我第一次尝试用 Class.create 来模仿它:

var Super2 = Class.create({
    fu: "bar"
});

var Sub2 = Class.create(Super2, {
    baz: "bat",
    f: function (e) {
        alert("Sub2:"+this.fu+this.baz);
    }.bindAsEventListener(this),
    initialize: function () {
        document.observe("click", this.f);
    }
});
new Sub2();

到目前为止一切顺利......但当然它不起作用:f 绑定(bind)到 window，而不是用 new< 创建的对象/强>。我找到的唯一方法是:

var Super3 = Class.create({
    fu: "bar"
});

var Sub3 = Class.create(Super3, {
    baz: "bat",
    f: function (e) {
        alert("Sub3:"+this.fu+this.baz);
    },
    initialize: function () {
        this.f = this.f.bindAsEventListener(this);
        document.observe("click", this.f);
    }
});
new Sub3();

但是真的很不雅观。我该如何处理？

编辑(回复Colin):

• 我需要绑定(bind) f 本身，以便我可以在 f 上调用 stopObserving(参见 http://prototypejs.org/api/event/stopObserving)

• 每当我在监听器中需要 this 时，我仍然需要 bindAsEventListener，因为默认情况下 this 是触发事件(参见 http://prototypejs.org/api/event/observe)

• 我仍在等待 googlegroup 上的答案 :) 我在这里发帖是为了看看是否可以通过 S.O 获得更快的答案。

• 我可以(而且可能应该)使用 bind 而不是 bindAsEventListener。我用后者来明确表示我得到了一个倾听者。这并没有改变绑定(bind)过程不优雅的事实。

Answer 1

你几乎明白了，只是不需要重新声明 this.f:

var Sub3 = Class.create(Super3, {
    baz: "bat",
    f: function () {
        alert("Sub3:"+this.fu+this.baz);
    },
    initialize: function () {
        document.observe("click", this.f.bindAsEventListener(this));
        // You could also use .bind(), since you don't pass any 
        // other arguments to f
    }
});

编辑:在回复您的评论时，您可以这样做(尽管可以说它与您的示例一样“丑陋”):

var Sub3 = Class.create(Super3, {
    baz: "bat",
    initialize: function () {
        this.f = function () {
           alert("Sub3:"+this.fu+this.baz);
        }.bind(this);

        document.observe("click", this.f);
    }
});

现在您可以将 stopObserving 与 this.f 一起使用。当您需要重新注册监听器时，您可以简单地再次使用 this.f，因为它仍然会绑定(bind)到调用初始化时所使用的同一实例。