Atölye › Köstebek Vurmaca › 4/18. adım

Saat ve döngü

Ne yapıyoruz

Köstebekler zamanla çıkıp saklanacak; oyunun bir saate ihtiyacı var. Saniyede ~60 kez çalışan bir döngü kuruyoruz. Tarayıcı döngüye her seferinde şu anki zamanı (milisaniye) veriyor; onu now (şimdi) değişkeninde tutacağız.

```js
let now = 0 // time of the current frame, in ms

function loop(time) {
  now = time
  draw()
  requestAnimationFrame(loop)
}

requestAnimationFrame(loop)
```

Ne işe yarıyor

• let now = 0 → şimdiki zaman, milisaniye (1 saniye = 1000 ms).
• function loop(time) → döngünün bir turu. time → tarayıcının verdiği zaman.
• now = time → zamanı sakla; oyunun her yeri buna bakacak.
• requestAnimationFrame(loop) → "ekran bir sonraki yenilenmeden önce loop'u yine çalıştır". Kendini yeniden istediği için döngü hiç durmaz.
• En alttaki çağrı döngüyü başlatır; eski tek seferlik draw()'ın yerini alır.

Sıra sende

1. Delik döngüsünün altına bir boş satır bırakıp let now = 0 ... yaz.
2. En alttaki draw() satırını sil; yerine loop fonksiyonunu ve altına requestAnimationFrame(loop) yaz.
3. Çalıştır: ekran aynı görünür ama artık saniyede 60 kez çiziliyor.

Beceriler: Oyun döngüsü

← Delikleri çiz Delikte bir köstebek →

Tüm adımlar

1. Yeşil bir çayır
2. Dokuz delik
3. Delikleri çiz
4. Saat ve döngü
5. Delikte bir köstebek
6. Köstebekler çıkıyor
7. Hangi deliğe tıklandı?
8. Vur!
9. Skoru göster
10. Başlamak için tıkla
11. Süre işliyor
12. Süre bitti
13. En iyi skor
14. Turun neresindeyiz?
15. Giderek hızlan
16. Her vuruşu hatırla
17. Yükselen +1
18. Kendin yap: kombo