Atölye › 2048 › 13/26. adım

Ok tuşu

Ne yapıyoruz

Şimdi oynayalım. Bir tabloda ok tuşlarını yönlere çeviriyoruz; şimdilik yalnız sol ok. Tuşa basılınca hamle yapılır ve ekran yeniden çizilir. Bu oyunda sürekli dönen bir döngü yok: ekran yalnız bir şey olunca değişir.

```js
const directions = { ArrowLeft: 'left' }

document.addEventListener('keydown', (event) => {
  const direction = directions[event.key]
  if (direction) {
    event.preventDefault()
    move(direction)
  }
  draw()
})
```

Ne işe yarıyor

const directions = { ArrowLeft: 'left' } → tuş adından yöne bir tablo. Diğer okları yönleri çalışınca ekleyeceğiz.
document.addEventListener('keydown', (event) => { ... }) → her tuş basışında çalışır; event.key tuşun adı.
directions[event.key] → tabloda varsa yön, yoksa undefined (yanlış sayılır).
event.preventDefault() → ok tuşlarının sayfayı kaydırmasını engeller.
draw() → her tuştan sonra ekranı yeniden çiz.

Sıra sende

function cellX(col) { satırının üstüne tabloyu ve dinleyiciyi yaz (aralarında bir boş satır); altında bir boş satır kalsın. Çalıştır, oyuna tıkla ve sol oka bas.

Beceriler: Klavye ve fare girdisi

← Sola hareket Yalnız gerçek hamleler sayılır →

Tüm adımlar