Atölye › Renk Hafızası (Simon) › 17/27. adım
Klavyeyle oynayabilelim: Q W üst sırada, A S alt sırada, tıpkı tuşların dizilişi gibi. 1–4 de çalışsın.
Tuş adından tuş numarasına bir arama tablosu kullanacağız: bir sözlük gibi, "q'nun karşılığı 0". Tarayıcıya da "bir tuşa basılınca bana haber ver" diyeceğiz. Buna olay dinlemek (event listener) denir: kapı zili gibi.
```js
const KEYS = { q: 0, w: 1, a: 2, s: 3, 1: 0, 2: 1, 3: 2, 4: 3 }
document.addEventListener('keydown', (event) => {
if (event.repeat) return
if (event.key in KEYS) press(KEYS[event.key])
})
```const KEYS = { q: 0, w: 1, ... } → bir nesne, ama bu sefer arama tablosu olarak: sol taraf tuşun adı, sağ
taraf tuş numarası.document.addEventListener('keydown', (event) => { ... }) → "sayfada bir tuşa basıldığında içini çalıştır".
event basılan tuşun bilgilerini taşır.if (event.repeat) return → tuş basılı tutulunca tarayıcı tekrar tekrar keydown gönderir; event.repeat
bunlarda doğrudur. Onları yok sayarız, yoksa tek basış birkaç basış sayılırdı.event.key in KEYS → "bu tuş adı tabloda var mı?" Boşluk ya da ok tuşları tabloda yok; onlar bir şey yapmaz.KEYS[event.key] → köşeli parantezle okuma: adı bir değişkende duran alanı okur. 'w' basıldıysa KEYS['w']
= 1.PADS listesinin kapanan ] işaretinin hemen altına KEYS satırını yaz.press fonksiyonunun altına bir boş satır bırak ve keydown dinleyicisini yaz.Beceriler: Klavye ve fare girdisi
← Her basışı kontrol et Bir noktada hangi tuş var? →