javascript - 遍历 JavaScript 对象以绑定(bind)键

Question

考虑以下代码:

controls = {
  'w': 'up',
  's': 'down',
  'a': 'left',
  'd': 'right'
};

keysPressed = [];

for (control in controls) {
  direction = controls[control];
  $(document).bind('keydown', control, function() {
    keysPressed.push(direction);
  });
}

只有 right 方向被绑定(bind)，并且它被绑定(bind)到所有四个键。这显然不是有意为之，但我错过了什么阻止所有属性被适当绑定(bind)的 JavaScript？

编辑:

为澄清起见，我使用的是 jQuery.hotkeys处理键名。这是一个片段；您可以假设所有变量都已声明。此外，代码位于安全 function 包装器中。

解决方案:

我用这个修改解决了它:

controls = {
  'w': 'up',
  's': 'down',
  'a': 'left',
  'd': 'right'
};

keysPressed = [];

addToKeyPressArray = function(value) {
  return function() {
    keysPressed.push(value);
  };
};

removeFromKeyPressArray = function(value) {
  return function() {
    keysPressed = keysPressed.filter(value);
  };
};

for (control in controls) {
  direction = controls[control];
  $(document).bind('keydown', control, addToKeyPressArray(direction));
  $(document).bind('keyup', control, removeFromKeyPressArray(direction));
}

这是一个奇怪的 JavaScript 怪癖。

Answer 1

在我看来，这可能是许多人在使用 JS 时遇到的基本“for 循环中的闭包”问题。

通过谷歌很容易找到解释和解决方案，例如:http://www.mennovanslooten.nl/blog/post/62