Workshop › Lunar Lander › Step 13 of 31

Remember held keys

What we are doing

The lander will be steered by holding keys. The events only note which keys are held; update will read the notes every frame.

```js
const keys = {}

document.addEventListener('keydown', (event) => {
  keys[event.key] = true
  if (event.key.startsWith('Arrow') || event.key === ' ') event.preventDefault()
})
document.addEventListener('keyup', (event) => {
  keys[event.key] = false
})
```

What it means

keys[event.key] = true sets the field named after the key, e.g. keys.ArrowUp; keyup sets it back to false.
startsWith('Arrow') is true for every arrow key; preventDefault() stops the page from scrolling.

Your turn

Under let state ... write const keys = {}.
Above function touchdown() {, write the two listeners, followed by an empty line.

Skills: Keyboard and mouse input

← Touching the ground Tilt →

All steps