Обращаясь к «this» в функции события, все еще имея возможность удалить событие TypeScript - PullRequest
Новая
       63

Обращаясь к «this» в функции события, все еще имея возможность удалить событие TypeScript

0 голосов
/ 18 февраля 2019

Я делаю эту игру на TypeScript и пытаюсь добавить и удалить событие «keydown».Функция события ссылается на «это», ведь это документ, но я пытаюсь сослаться на экземпляр объекта.

Как этого достичь? 

class Player {
    board: Board = new Board();
    pice: Pice = new Pice();

    constructor() {
        this.addKeyEvents();
    }

    addKeyEvents(): void {
        document.addEventListener("keydown", this.keyClick);
    }

    removeKeyEvents(): void {
        document.removeEventListener("keydown", this.keyClick);
    }

    keyClick(event: KeyboardEvent): void {
        console.log(this); // #document

        switch (event.keyCode) {

            // Left
            case 37:
                this.pice.move(-1, 0, this.board);
                break;
        }

    }

}

1 Ответ

0 голосов
/ 18 февраля 2019

Вам придется привязать функцию к экземпляру или использовать функцию стрелки, чтобы обеспечить правильный контекст. 

// Binding way.
class Player {
    constructor() {
        this.addKeyEvents();
        // Bind the function to `this` context.
        this.keyClick = this.keyClick.bind(this)
    }

    addKeyEvents(): void {
        document.addEventListener("keydown", this.keyClick);
    }

    keyClick(event: KeyboardEvent): void { /* ... */ }
}

// Arrow function way.
class Player {
    constructor() {
        this.addKeyEvents();
    }

    addKeyEvents(): void {
        // Create an intermediary arrow function that will keep the context.
        document.addEventListener("keydown", event => this.keyClick(event));
    }

    keyClick(event: KeyboardEvent): void { /* ... */ }
}
...