Asenkron callback'ler

JavaScript kursu · Orta seviye · Ders 67/134

Bir callback'in olay döngüsü (event loop) tarafından nasıl sonradan çağrıldığını öğrenirsin.

Asenkron callback'ler

Bazı callback'ler hemen çalışmaz; sonradan çağrılır. setTimeout bunun en bilinen örneğidir: verdiğin callback'i belirlediğin gecikme sonrasında event loop (olay döngüsü) devreye alır.

console.log('Bir');
setTimeout(() => {
  console.log('İki');
}, 0);
console.log('Üç');

Beklenen çıktı 'Bir, Üç, İki' sırasıdır. Çünkü setTimeout'ın callback'i call stack boşalana kadar bekler. Bu desene asenkron callback denir.

Call stack ve callback queue

JavaScript tek iş parçacıklıdır; bir defada tek iş yapar. Call stack (çağrı yığını) şu an çalışan fonksiyonları tutar. setTimeout gibi çağrılar tarayıcıya bir zamanlayıcı başlatır; süre dolunca callback callback queue'ye (sıraya) konur.

Event loop sürekli iki şeyi kontrol eder: call stack boş mu, ve sırada bekleyen callback var mı. Stack boşalınca sıradaki callback'i stack'e alır ve çalıştırır. Bu yüzden asenkron callback'ler her zaman mevcut kodun bitmesini bekler.

Uygulama runLater fonksiyonunu yaz

runLater adında bir fonksiyon tanımla. İki parametre alsın: delay (milisaniye) ve callback. Fonksiyon içinde setTimeout'u kullanarak callback'i delay ms sonra çağır.

Örnek çözümü göster

function runLater(delay, callback) {
  setTimeout(callback, delay);
}

Kendini test et

Aşağıdaki kodun çıktısı ne olur?
```
console.log('A');
setTimeout(() => console.log('B'), 0);
console.log('C');
```
- A, C, B
- A, B, C
- B, A, C
- C, A, B
Cevabı göster

A, C, B — Doğru! Senkron kod önce biter; setTimeout callback'i en son çalışır.

setTimeout callback'ini tamamla

setTimeout(() => {
  console.log(____);
}, 500);

Cevabı göster

setTimeout(() => {
  console.log('Hazır');
}, 500);

Kavramları eşleştir

call stack

Şu an çalışanlar
callback queue

Bekleyen callback'ler
event loop

Stack'i izler
setTimeout

Callback zamanlar
Hangisi her zaman önce çalışır?
- setTimeout callback'i
- Event loop
- Senkron kod
- Callback queue
Cevabı göster

Senkron kod — Doğru! Senkron kod call stack'te anında yürütülür; asenkron callback'ler onu bekler.

Orta seviye bölümündeki tüm dersler

1 Arrow fonksiyonlar

Asenkron callback'ler