在Javascript中访问事件处理程序中的类成员变量

Question

我有一个关于从类使用的事件处理程序内部访问Javascript类成员变量的正确方法的快速问题.例如:

function Map() {
    this.x = 0;
    this.y = 0;

    $("body").mousemove( function(event) {
        this.x = event.pageX;     // Is not able to access Map's member variable "x"
        this.y = event.pageY;     // Is not able to access Map's member variable "y"
    });
}

事件处理程序中的"this.x"尝试影响触发事件的元素的"x"成员变量,而不是更改"Map"类的成员变量.从事件处理程序中访问"Map"类的成员变量的正确方法是什么？

任何帮助将不胜感激 - 我一直在这个问题上摸不着头脑.

干杯,查理

Answer 1

由于this事件上下文中的更改(global通常指向),您需要在事件之外存储对自己的引用:

function Map() {
    this.x = 0;
    this.y = 0;
    var _self = this;
    $("body").mousemove( function(event) {
        _self.x = event.pageX;     // Is now able to access Map's member variable "x"
        _self.y = event.pageY;     // Is now able to access Map's member variable "y"
    });
}

Answer 2

马特给出的解决方案可能就是这样.

我想我会指出你可以通过事件对象传递数据,如下所示:

function Map() {
    this.x = 0;
    this.y = 0;

// Pass object with data-------------v
    $("body").bind('mousemove', {ths: this}, function(event) {
            // access this via event.data
        event.data.ths.x = event.pageX;
        event.data.ths.y = event.pageY;     
    });
}

这只是为了信息.这真的不是一个实际应用.Matt对局部变量的引用更有意义.