Définition de variables dans addEventListener

Question

Dans le code suivant, j'ai tenté de définir une variable d'entrée dans une fonction appelée par addEventListener. Le problème que j'ai rencontré est que la variable d'entrée 'input_left' n'est jamais définie sur true. Le code sous l'instruction if n'est pas exécuté, mais le code qui doit définir la variable est exécuté. J'ai essayé de jouer avec la fonction bind(), mais cela n'a rien changé.

//Player 
var Player = function() { 
    this.input_left = false; 
} 

Player.prototype.update = function() { 
    this.input_left = false; 

    window.addEventListener('keydown', this.keyPressed.bind(this)); 

    if (this.input_left) { 
     alert('2'); //It doesn't show this 
    } 
} 

Player.prototype.keyPressed = function(e) { 
    switch(e.keyCode) { 
     case 65: 
      this.input_left = true; 
      alert('1'); //It shows this 
     break; 
    } 
} 

//Initialize the object 
var player = new Player(); 

//Game loop 
var gameLoop = function() { 
    player.update(); 
    window.requestAnimationFrame(gameLoop); 
} 
window.requestAnimationFrame(gameLoop); 

Je soupçonne que la variable this.input_left du joueur est jamais correctement réglé, même si le code qui définit est exécuté, je me demande comment faire en sorte que la variable est correctement réglée de telle sorte que aussi alerte ('2'); fonctionne.

Answer 1

Vous devez déplacer votre écouteur d'événement dans votre constructeur (ou dans une fonction init) afin de ne pas le créer de nouveau encore et encore.

Vous définissez également input_left sur false juste avant de le vérifier dans votre fonction de mise à jour, alors pourquoi ne pas le réinitialiser avant de le réinitialiser?

//Player 
 
var Player = function() { 
 
    this.input_left = false; 
 
    window.addEventListener('keydown', this.keyPressed.bind(this)); 
 
} 
 

 
Player.prototype.update = function() { 
 
    if (this.input_left) { 
 
     console.log('2'); //It shows this 
 
    } 
 
    this.input_left = false; 
 
} 
 

 
Player.prototype.keyPressed = function(e) { 
 
    switch(e.keyCode) { 
 
     case 65: 
 
      this.input_left = true; 
 
      console.log('1'); //It shows this 
 
     break; 
 
    } 
 
} 
 

 
//Initialize the object 
 
var player = new Player(); 
 

 
//Game loop 
 
var gameLoop = function() { 
 
    player.update(); 
 
    window.requestAnimationFrame(gameLoop); 
 
} 
 
window.requestAnimationFrame(gameLoop);