Atölye › Wordle Tarzı Kelime Tahmini › 8/26. adım
Şimdi klavyeyi 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.
Ama klavye her türlü tuşu gönderir: 'Shift', 'F5', '1'... Sadece tek harfleri (a'dan z'ye) kabul edeceğiz.
Bunu sormanın kısa bir yolu var: düzenli ifade (regular expression), yazılar için küçük bir kalıp.
```js
document.addEventListener('keydown', (event) => {
const key = event.key.length === 1 ? event.key.toLowerCase() : event.key
if (/^[a-z]$/.test(key)) {
event.preventDefault()
type(key)
}
})
```document.addEventListener('keydown', (event) => { ... }) → sayfada bir tuşa basıldığında süslü parantez içini
çalıştır. event basılan tuşun bilgilerini taşır; event.key tuşun adı.event.key.length === 1 ? event.key.toLowerCase() : event.key → kısa bir if (koşul ? a : b): ad tek
karakterse küçük harfe çevir ('A' → 'a'; Shift ya da Caps Lock açıkken büyük gelir), değilse ('Shift')
olduğu gibi bırak./^[a-z]$/ → bir düzenli ifade: [a-z] "a'dan z'ye bir harf", ^ "başı", $ "sonu". Yani yazının tamamı
tek bir harf olmalı; 'Shift' ya da 'F5' araya sızamaz..test(key) → key bu kalıba uyuyor mu? true ya da false.event.preventDefault() → tarayıcının o tuşla yapacağı kendi işini engeller (örneğin sayfada aramaya başlamak).Dinleyiciyi type fonksiyonunun altına, bir boş satır bırakarak yaz. Çalıştır, oyuna bir kez tıkla (klavye oyuna
gitsin). Harfleri henüz çizmiyoruz; kontroller yazılanı okuyor.
Beceriler: Klavye ve fare girdisi
← Yazılan harfler Harfleri göster →