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

Question

我有一个JS对象,其中一个原型函数是一个点击的事件处理程序.调用该函数时,该this对象将设置为单击绑定的元素.我想this成为该函数所属对象的实例.这是可能的,如果是的话,我该怎么做？有或没有jQuery的解决方案对我来说是可以接受的,虽然我确信其余的SO会欣赏纯粹的JS解决方案.

我已经尝试过bind这个函数this,它被绑定到窗口而不是对象的实例.

我想要的示例:在此演示中(下面重复的代码),我想要一个单击按钮时显示"Bark"的警报.

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();
});