javascript - removeEventListener、对象和 this

Question

所以，这听起来像是一个微不足道的问题，但不知何故我不太确定如何解决它。

这是我想要实现的目标:

function myObject() {
    //...
}

myObject.prototype.method1 = function() {
    document.addEventListener("mousemove", this.method3, false);
}

myObject.prototype.method2 = function() {
    document.removeEventListener("mousemove", this.method3, false);
}

myObject.prototype.method3 = function(e) {
    //...
}

显然这是行不通的，因为“this”的范围是错误的。我通常的解决方法是使用匿名函数:

myObject.prototype.method1 = function() {
    var that = this;

    document.addEventListener("mousemove", function(e) {that.method3(e);}, false);
}

但是我无法使用removeEventListener

解决此类问题的最佳方法是什么？我真的不想将全局变量用于中间函数。

Answer 1

您可以将处理函数传递给 method1 和 method2。毕竟，这些方法可能也想注册其他处理程序是有道理的……

(更改一些函数的名称以使它们在这里更有意义)

function myObject() {
    //...
}

myObject.prototype.listenMouse = function(handler) {
    document.addEventListener("mousemove", handler, false);
}

myObject.prototype.unlistenMouse = function(handler) {
    document.removeEventListener("mousemove", handler, false);
}

myObject.prototype.standardMouseHandler = function(e) {
    //...
}

然后:

var obj = new myObject();
obj.listenMouse(obj.standardMouseHandler);
// ...
obj.unlistenMouse(obj.standardMouseHandler);