addEventListener не работает внутри функции

Question

У меня возникли проблемы с добавлением слушателя событий. Я в основном герметизирующего все клавиатурные функции, связанные в классе JavaScript следующим образом:

function Keyboard() 
{ 
    this.key = new Array(); 

    for(x=0;x<255;x++) 
    { 
     this.key[x] = false; 
    } 

    function keyDown(evt) 
    { 
     this.key[evt.keyCode] = true; 
     console.log("Keydown bioch"); 
    } 

    function keyUp(evt) 
    { 
     this.key[evt.keyCode] = false; 
    } 

    window.addEventListener('keydown', this.keyDown, true); 
    window.addEventListener('keyup', this.keyUp, true); 
} 

Кроме того, что он не работает - вообще. Когда я удаляю функцию Keyboard и делаю все глобальным (клавиши [], keyDown, keyUp и addEventListener, все работает.

Что я делаю неправильно?

Answer 1

Вы используете this keyword, где это не подходит. Кроме того, ваши объекты не имеют свойств keyDown/keyUp.

Вам нужно будет разыменовать массив, так как в прослушивателе будет указывать на элемент приема события (dom), который не имеет свойства key. И ссылаться на свои локальные функции, просто использовать их имена:

function Keyboard() { 
    var arr = this.key = new Array(); 
    for(x=0;x<255;x++) 
     arr[x] = false; 

    function keyDown(evt) { 
     arr[evt.keyCode] = true; 
     console.log("Keydown bioch"); 
    } 
    function keyUp(evt) { 
     arr[evt.keyCode] = false; 
    } 

    window.addEventListener('keydown', keyDown, true); 
    window.addEventListener('keyup', keyUp, true); 
} 

Answer 2

«это» ссылка в функции обратного вызова ссылается на объекте окна, а не область видимости функции, как вы могли бы ожидать.

См. Этот ответ.

JavaScript Callback Scope