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」看作自己（文檔對象）。