Atölye › Yazı Yağmuru › 12/33. adım
Şimdi klavyeyi type'a bağlıyoruz. Tarayıcıya "bir tuşa basılınca bana haber ver" deriz; buna olay dinlemek
(event listener) denir: kapı zili gibi, çalınca ne yapılacağını önceden söylersin.
Yalnız harfler bizi ilgilendirir: a'dan z'ye. Shift, oklar, rakamlar görmezden gelinir. Caps Lock açıkken
büyük harf gelir; onu küçüğe çeviririz.
```js
document.addEventListener('keydown', (event) => {
const key = event.key.toLowerCase()
if (key.length === 1 && key >= 'a' && key <= 'z') {
event.preventDefault()
type(key)
}
})
```document.addEventListener('keydown', (event) => { ... }) → "sayfada bir tuşa basıldığında içini çalıştır".
event basılan tuşun bilgilerini taşır.event.key → tuşun adı: 'c', 'C', 'Shift', 'ArrowUp'....toLowerCase() → küçük harfe çevirir: 'C' → 'c'.key.length === 1 → tek harfli mi? ('Shift' 5 harf.) && "ve".key >= 'a' && key <= 'z' → harfler de alfabe sırasıyla karşılaştırılabilir: 'a' ile 'z' arasında mı? Böylece
'1' ya da '-' elenir.event.preventDefault() → tarayıcının o tuşla kendi yaptığı işi engeller (bazı tarayıcılarda harf tuşu sayfada
arama başlatır).type(key) → harfi oyuna ver.update'in altına, function draw() { satırının üstüne dinleyiciyi yaz; altında bir boş satır kalsın.
Çalıştır, oyuna bir kez tıkla (klavye oyuna gitsin). Ekranda henüz bir şey değişmez; hedef kilitlenir ama bunu
göstermiyoruz.
Beceriler: Klavye ve fare girdisi
← Bir kelimeye kilitlen Harf harf →