Senkronize olmayan işlemler, özellikle ağ istekleri veya dosya işlemleri gibi G/Ç bağlı görevlerle uğraşırken, modern JavaScript uygulamalarının temelini oluşturur. Promise’ler, bu senkronize olmayan eylemlerin nihai sonuçlarını yönetmek için yapılandırılmış ve zarif bir yol sunar. Bu kılavuz, Promise’lerin mekaniğini, yaşam döngülerini ve güçlü async/await sözdizimini kullanarak bunları işlemeyle ilgili en iyi uygulamaları ele almaktadır.
İçerik Tablosu
- JavaScript’te Promise’ler Nedir?
- Promise Yaşam Döngüsü: Durumlar ve Geçişler
- Promise İşlemede Async/Await’i Öğrenmek
- Promise’lerle Sağlam Hata İşleme
- Sıralı İşlemler İçin Promise’leri Zincirleme
- Birden Fazla Promise’i Eş Zamanlı Olarak İşleme
JavaScript’te Promise’ler Nedir?
Bir Promise, senkronize olmayan bir işlemin nihai tamamlanmasını (veya başarısızlığını) temsil eden bir nesnedir. Değerleri hemen döndüren senkron fonksiyonların aksine, senkronize olmayan bir fonksiyon, gelecekteki bir değer için yer tutucu görevi gören bir Promise döndürür. Bu değer, senkronize olmayan işlem tamamlandığında kullanılabilir olacaktır.
Promise’ler, özellikle birden fazla iç içe geçmiş senkronize olmayan işlemle uğraşırken (“callback cehennemi”nden kaçınarak), geleneksel geri çağrımlara göre daha temiz bir alternatif sunar ve kod okunabilirliğini ve sürdürülebilirliğini önemli ölçüde artırır.
Promise Yaşam Döngüsü: Durumlar ve Geçişler
Bir Promise üç durumdan birinde bulunabilir:
- Beklemede (Pending): Başlangıç durumu. Senkronize olmayan işlem hala devam ediyor.
- Tamamlanmış (Fulfilled/Resolved): İşlem başarıyla tamamlandı ve Promise artık bir sonuç değeri içeriyor.
- Reddedilmiş (Rejected): İşlem başarısız oldu ve Promise başarısızlığın nedenini (genellikle bir hata nesnesi) içeriyor.
Bu durumlar arasındaki geçişler tek yönlüdür: Beklemede durumu, Tamamlanmış veya Reddedilmiş duruma geçebilir, ancak bir Promise Tamamlanmış veya Reddedilmiş olduktan sonra durumunu değiştiremez.
Promise İşlemede Async/Await’i Öğrenmek
async/await anahtar kelimeleri, Promise’lerle çalışmak için daha senkron benzeri bir stil sağlar, kod okunabilirliğini artırır ve senkronize olmayan kodu daha kolay anlaşılabilir hale getirir. async, bir fonksiyonu senkronize olmayan olarak tanımlar ve içinde await kullanımına izin verir. await, bir Promise çözülene (veya reddedilene) kadar yürütmeyi duraklatır.
Promise’lerle Sağlam Hata İşleme
Senkronize olmayan işlemlerle çalışırken etkili hata işleme çok önemlidir. Reddedilen Promise’leri işlemek için .catch() yöntemi kullanılır. Kapsamlı hata yönetimi için async/await bloklarını try...catch ifadeleriyle sarmak en iyi uygulamadır.
async function fetchData() {
try {
const response = await fetch('some-url');
if (!response.ok) {
throw new Error(`HTTP hatası! durum: ${response.status}`);
}
const data = await response.json();
return data;
} catch (error) {
console.error('Veri çekerken hata:', error);
// Hatayı uygun şekilde işleyin, örneğin, bir hata mesajı görüntüleyin, isteği yeniden deneyin vb.
throw error; // Üst seviyelerin hatayı işlemesine izin vermek için yeniden fırlatın
}
}
Sıralı İşlemler İçin Promise’leri Zincirleme
Birden fazla senkronize olmayan işlem birbirine bağlı olduğunda, .then() kullanarak Promise’leri zincirleyebilirsiniz. Bir Promise’in sonucu, bir sonrakine girdi olarak geçirilir.
fetchData()
.then(data => processData(data))
.then(result => displayResult(result))
.catch(error => handleError(error));
Birden Fazla Promise’i Eş Zamanlı Olarak İşleme
Bağımsız senkronize olmayan işlemler için, bunları Promise.all() kullanarak paralel olarak çalıştırabilirsiniz. Bu fonksiyon, bir Promise dizisi alır ve dizideki tüm Promise’ler çözüldüğünde çözülür. Çözümlenmiş değerlerin bir dizisini döndürür.
async function fetchDataFromMultipleSources() {
const promises = [
fetch('url1').then(response => response.json()),
fetch('url2').then(response => response.json()),
fetch('url3').then(response => response.json())
];
try {
const results = await Promise.all(promises);
console.log('Tüm kaynaklardan gelen veriler:', results);
} catch (error) {
console.error('Bir veya daha fazla kaynaktan veri çekerken hata:', error);
}
}