javascript - 如何防止 "this"被事件处理程序反弹

Question

我有一个 JS 对象，它的原型(prototype)函数之一是单击事件处理程序。当该函数被调用时，this 对象被设置为点击绑定(bind)到的元素。我希望 this 成为函数所属对象的实例。这可能吗？如果可以，我该怎么做？有或没有 jQuery 的解决方案对我来说都是可以接受的，尽管我确信 SO 的其余部分会喜欢纯 JS 解决方案。

我试过了 binding the function to this , 它被绑定(bind)到窗口而不是对象的实例。

我想要的例子:在this demo (代码在下面重复)，我想要在单击按钮时显示“吠叫”的警报。

var Dog = function () {
    this.sound = "Bark";
}

Dog.prototype = {
    sayHello: function (e) {
        if (typeof this.sound == "undefined") {
            alert("I don't know what sound I should make!\n" + this);
        } else {
            alert(this.sound);
        }
    }
}

var d = new Dog();
var elem = document.getElementById("click");
elem.addEventListener("click", d.sayHello);

Answer 1

您可以像这样使用 .bind():

elem.addEventListener("click", d.sayHello.bind(d));

手动方法是使用您自己的函数:

elem.addEventListener("click", function(e) {
    return d.sayHello();
});