跟踪按键
对于这样的游戏,我们不希望按键在每次按下时生效。相反,我们希望只要按下了它们,他们的效果(移动球员的数字)就一直有效。
我们需要设置一个键盘处理器来存储左、右、上键的当前状态。我们调用preventDefault
,防止按键产生页面滚动。
下面的函数接受一个按键名称数组,返回跟踪这些按键的当前位置的对象。并注册"keydown"
和"keyup"
事件,当事件对应的按键代码存在于其存储的按键代码集合中时,就更新对象。
function trackKeys(keys) {
let down = Object.create(null);
function track(event) {
if (keys.includes(event.key)) {
down[event.key] = event.type == "keydown";
event.preventDefault();
}
}
window.addEventListener("keydown", track);
window.addEventListener("keyup", track);
return down;
}
const arrowKeys =
trackKeys(["ArrowLeft", "ArrowRight", "ArrowUp"]);
两种事件类型都使用相同的处理程序函数。该处理函数根据事件对象的type属性来确定是将按键状态修改为true(“keydown”)还是false(“keyup”)。