Javascript“onmousemove”事件不能与类

Question

我真的不知道如何在标题中使用这个短语，但我试图创建一个包含所有事件函数的类，但是我遇到了一些奇怪的问题。

这是一些问题的模拟代码。

class Mouse{ 
    constructor(){ 
     this.x = 0; 
     this.y = 0; 
    } 
} 

class MainClass{ 
    constructor(){ 
     this.mouse = new Mouse(); 
    } 

    updateMouse(event){ 
     this.mouse.x = event.clientX; 
     this.mouse.y = event.clientY; 
    } 
} 

var mouse; 
var main; 

window.onload = function(){ 
    main = new MainClass(); 

    document.onmousemove = main.updateMouse; 
} 

我遇到的主要问题是，当我运行它，它会返回错误“无法设置属性‘X’的未定义”这很奇怪，因为当我通过程序main.mouse.x步骤是定义，直到document.onmousemove行。

如果我移动updateMouse（）函数进入鼠标类，而做到这一点，而不是：

mouse = new Mouse(); 
document.onmousemove = mouse.updateMouse(); 

然后它工作，但在实际的程序我想写的updateMouse（）方法的需求调用MainClass中的其他方法，所以我不能这样做。

Answer 1

你必须使用

window.onload = function(){ 
    main = new MainClass(); 

    document.onmousemove = main.updateMouse.bind(main); // bound function 
}; 

尝试。如果你不绑定函数，它会将“this”看作自己（文档对象）。