javascript - 未捕获的类型错误 : Cannot set property of undefined

Question

Google Chrome 抛出“未捕获的类型错误:无法设置未定义的属性“isDown””，但我的代码看起来没有任何问题!

我的变量数组的重要部分:

KEY = {
    UP: 38,
    DOWN: 40,
    W: 87,
    S: 83,
    D: 68
}
pingpong = {
    fps: 60,
    pressedKeys: [],
    complete: false,
}

关键监听器初始化(这是抛出错误的地方):

    for (var keyCode in KEY) {
        if (KEY.hasOwnProperty(keyCode)) {
            pingpong.pressedKeys[KEY[keyCode]] = {
                isDown: false,
                wasDown: false
            };
        }
    }
    $(document).keydown(function(e) {
        pingpong.pressedKeys[e.which].isDown = true;
    });
    $(document).keyup(function(e) {
/* This line is the issue */    pingpong.pressedKeys[e.which].isDown = false;
    });

有什么想法吗？

Answer 1

问题是您正在尝试访问 pressedKeys 数组中不存在的元素。例如，如果我们按下“a”键:

$(document).keyup(function(e) {
    //Pressed "a" so e.which == 65
    pingpong.pressedKeys[e.which].isDown = false;
});

初始化数组时，您仅为 KEY 对象的属性创建元素:

for (var keyCode in KEY) {
    //Iterating over KEY, which contains 5 properties...
    if (KEY.hasOwnProperty(keyCode)) {
        //Add value to pressedKeys (this happens for each of the 5 properties)
        pingpong.pressedKeys[KEY[keyCode]] = {
            isDown: false,
            wasDown: false
        };
    }
}

所以pressedKeys只包含5个元素，对应于KEY的属性。请注意，keydown 事件处理程序以及 keyup 中也会引发 TypeError。

要修复此问题，您可以检查 e.which 是否位于事件处理函数的 KEYS 对象中。如果不是，请忽略它。也许是这样的(可能有更好的方法，这正是首先想到的):

$(document).keydown(function(e) {
    for(var k in KEY) {
        if(KEY[k] == e.which) {
            break; //Break out of loop and execute last line
        }
        return false; //Key not recognized, last line is not executed
    }
    pingpong.pressedKeys[e.which].isDown = true;
});