Question

我有一个javascript密钥处理函数，我试图在一个游戏中使用它，但我似乎没有工作，我不确定它的编辑器或代码是否有错误。我的代码如下所示：

var myKey = {
    pressedKeys: [],
    LEFT: 37,
    UP: 38,
    RIGHT: 39,
    DOWN: 40,
    isPressed: function(zKey){
        return this.pressedKeys[zKey];
    },
    onkeyDown: function(event){
        this.pressedKeys[event.keyCode] = true;
    },
    onkeyUp: function(event){
        this.pressedKeys[event.keyCode] = false;   
    },
};

window.addEventListener("keydown", myKey.onkeyDown);
window.addEventListener("keyup", myKey.onkeyUp);

var checkInput = function(){
    if(myKey.pressedKeys[myKey.LEFT]){
        confirm("Pressed Left");
    }
}

var gameLoop = function(){
    checkInput();
    window.requestAnimationFrame(gameLoop);
}

游戏循环动画帧是第一次在主要功能中调用，此处未显示。我不明白会出现什么问题。我努力编码数字但仍然没有，但它很可能是我的编辑。

Answer 1

当您获得对方法的引用并将其用作事件处理程序时，该函数不再与该对象关联。函数内的this不是对myKey对象的引用，而是对window对象的引用（因为它是事件发生的对象）。

您可以使用bind method指定函数的上下文：

window.addEventListener("keydown", myKey.onkeyDown.bind(myKey));
window.addEventListener("keyup", myKey.onkeyUp.bind(myKey));

请注意，某些较旧的浏览器不支持bind方法，例如IE8及更早版本的浏览器，因此您需要使用＆＃39; polyfill＆＃39;如果你需要支持他们。我在上面链接的文档中有一个。

您还可以使用函数包装器来调用方法：

window.addEventListener("keydown", function(e){ myKey.onkeyDown(e); });
window.addEventListener("keyup", function(e){ myKey.onkeyUp(e); });

Javascript密钥处理程序

1 个答案: