addEventListenerで変数を設定する

Question

次のコードでは、addEventListenerによって呼び出される関数で入力変数を設定しようとしました。私が遭遇した問題は、入力変数 'input_left'が決してtrueに設定されないということです。 ifステートメントの下のコードは実行されませんが、変数を設定するコードが実行されます。私はbind（）関数を使いこなそうとしましたが、何も変わりませんでした。

//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); 

私はプレイヤーのthis.input_left変数は、それを設定するコードが実行されていても、適切に設定されることはありませんと思われる、私は（も警告するように、変数が正しく設定されていることを確認する方法を疑問に思って'2'）;走る

Answer 1

イベントリスナーをコンストラクタ（またはいくつかのinit関数）に移動して、それを繰り返し作成しないようにする必要があります。

また、更新機能で確認する直前にinput_leftをfalseに設定しています。リセットする前に確認するのはどうですか？

//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);