javascript - 理解数组的关键代码

Question

所以我在网上找到了这段代码，它可以帮助我用按键控制我的 Sprite ，但我不太确定它是如何工作的。有人可以在某种程度上详细地向我描述数组如何工作到关键代码等吗？

它基本上让左右键和空格键起作用。

    var keys = [];  

    //This is part of a class
    this.listenInput = function() {
            if (keys[37]) {
                this.x -= speed; 
            }
            if (keys[39]) {
                this.x += speed;
            }
        };


function setupKeys() {
    var listenedKeys = [32, 37, 38, 39, 40];

    function keyUpHandler(event) {
       var keyCode = event.keyCode;
       if (listenedKeys.indexOf(keyCode) === -1) return;
       keys[keyCode] = false;        
    }
       function keyDownHandler(event) {
            var keyCode = event.keyCode;
            if (listenedKeys.indexOf(keyCode) === -1) return;
            keys[keyCode] = true;        
            if (keyCode === 32) {
               spaceBarPressed = true;
            }
           event.preventDefault();
        }

        //Event listeners for keys
        window.addEventListener("keydown", keyDownHandler, false);
        window.addEventListener("keyup", keyUpHandler, false);
    }

Answer 1

浏览器无法告诉您是否按下了某个键。它只知道何时按下或压下某个键。因此，您必须自己跟踪 key 的状态。当按下某个键 (keyDownHandler) 时，您会记住它已被按下。当某个键被按下时 (keyUpHandler)，您会记得它没有被按下。这允许您的游戏循环对连续的按钮组合使用react，而不是仅在按下时使用react，或依赖自动重复来触发。