Promise.race derinlemesine
Promise.race ile zaman aşımı deseni ve ilk sonucu kullanmayı öğrenirsin.
Promise.race derinlemesine
Promise.race, verilen promise'lar arasından ilk yerleşen (settle) sonucu alır. Önemli nokta: yerleşme hem fulfill hem reject demektir. Yani ilk gelen bir reddedilme ise race de reddedilir.
const r = await Promise.race([
task,
timeoutPromise
]);Bu davranış, Promise.any'den farklıdır: any yalnızca fulfill'i bekler, race ise ilk yerleşeni kabul eder. Bu yüzden race, zaman aşımı desenleri için idealdir.
Zaman aşımı deseni
Bir işlemi süre sınırına bağlamak için Promise.race kullanırsın. İşlem promise'ı ile birlikte reddeden bir zamanlayıcı promise'ını yarıştırırsın. Zamanlayıcı önce gelirse işlem çok yavaş demektir.
function withTimeout(task, ms) {
const timer = new Promise((_, reject) =>
setTimeout(() => reject('zaman aşımı'), ms)
);
return Promise.race([task, timer]);
}Bu desen, ağ isteğinin sonsuza kadar asılı kalmasını engeller; kullanıcıya hızlı geri bildirim verir.
Uygulama fetchWithTimeout fonksiyonu
fetchWithTimeout(url, ms) adında bir fonksiyon yaz. İçinde timeout adında bir promise tanımla: new Promise ile setTimeout kullanarak ms milisaniye sonra reddetsin. Promise.race ile fetch(url) ve timeout'u yarıştırıp sonucu döndür. result değişkenine fetchWithTimeout('/data', 500) çağrısının sonucunu await ile al ve console.log ile yazdır.
Örnek çözümü göster
function fetchWithTimeout(url, ms) {
const timeout = new Promise((_, reject) =>
setTimeout(() => reject('zaman aşımı'), ms)
);
return Promise.race([fetch(url), timeout]);
}
const result = await fetchWithTimeout('/data', 500);
console.log(result);Kendini test et
-
Promise.race ile iki promise yarışıyor: biri 50ms'de fulfill, diğeri 30ms'de reject. Sonuç ne olur?
- 50ms'deki fulfilled değeri döner
- 30ms'deki rejection fırlatılır
- İkisi de döner
- AggregateError fırlatılır
Cevabı göster
30ms'deki rejection fırlatılır — Doğru! race ilk yerleşeni alır; 30ms'deki reject daha önce geldiği için o kazanır.
-
Yarış desenlerini eşleştir
- race
- ilk yerleşen
- any
- ilk fulfill
- allSettled
- tümü beklenir
- timeout
- reddeden zamanlayıcı
-
Zaman aşımı promise'i
const timeout = new Promise((_, reject) => setTimeout(() => reject('zaman aşımı'), ____)); const result = await Promise.race([task, timeout]);Cevabı göster
const timeout = new Promise((_, reject) => setTimeout(() => reject('zaman aşımı'), 500)); const result = await Promise.race([task, timeout]);