Hata #1: 'then' ve 'catch' Zincirlemesi Yanlış Yapmak
Birçok JavaScript geliştiricisi, `Promise` zincirlerini oluştururken doğru sıralamayı gözden kaçırır. Zincirleme işlemlerini doğru yapmadığınızda, beklenmedik hatalar ve zor çözülmesi gereken sorunlar ortaya çıkabilir. İşte doğru ve yanlış kullanım örnekleri:
Yanlış Kullanım:
fetch('https://api.example.com/data')
.then(response => response.json())
.catch(error => console.error(error));
Doğru Kullanım:
fetch('https://api.example.com/data')
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error(error));
Gördüğünüz gibi, `catch` sadece bir hata meydana geldiğinde çalışır ve doğru sıralama, kodun daha temiz ve hatasız olmasını sağlar.
Hata #2: Promise'leri Döndürmeyi Unutmak
Birçok geliştirici, `Promise` döndürmeyi unutur ve asenkron işlemler beklenmedik şekilde sonlanabilir. Bu durum, çoğunlukla veri beklerken uygulamanın yanlış bir şekilde tepki vermesine neden olur.
Yanlış Kullanım:
function getData() {
fetch('https://api.example.com/data')
.then(response => response.json())
.then(data => console.log(data));
}
Doğru Kullanım:
function getData() {
return fetch('https://api.example.com/data')
.then(response => response.json())
.then(data => console.log(data));
}
Burada, `Promise` döndürmeyi unuttuğunuzda, iş akışınızda asenkron işlemler beklenmedik şekilde sona erer. Döndürdüğünüzde, doğru bir şekilde yönetilebilir.
Hata #3: 'async/await' ile Promise Kullanımını Karmak
Bir diğer yaygın hata ise, `async/await` ile `Promise` zincirlemesini karıştırmaktır. Bu, kodun okunabilirliğini zorlaştırabilir ve hata ayıklamayı karmaşık hale getirebilir.
Yanlış Kullanım:
async function getData() {
fetch('https://api.example.com/data')
.then(response => response.json())
.then(data => console.log(data));
}
Doğru Kullanım:
async function getData() {
const response = await fetch('https://api.example.com/data');
const data = await response.json();
console.log(data);
}
`async/await` kombinasyonunu kullanırken `then` yerine `await` kullanmanız gerekmektedir. Bu şekilde, kodunuzu daha temiz ve okunabilir hale getirebilirsiniz.
Hata #4: Promise.all Kullanımında Yanlış Bekleme
`Promise.all`, birden fazla asenkron işlemi paralel olarak çalıştırmak için mükemmel bir araçtır. Ancak, tüm `Promise`'lerin doğru bir şekilde beklenmesi gerektiği gözden kaçırılabilir.
Yanlış Kullanım:
Promise.all([
fetch('https://api.example.com/data1'),
fetch('https://api.example.com/data2')
]).then(responses => {
responses[0].json();
responses[1].json();
});
Doğru Kullanım:
Promise.all([
fetch('https://api.example.com/data1'),
fetch('https://api.example.com/data2')
]).then(async ([response1, response2]) => {
const data1 = await response1.json();
const data2 = await response2.json();
console.log(data1, data2);
});
Burada, her bir `Promise`'in doğru şekilde beklenmesi, işlem sırasının doğru olmasını sağlar.
Hata #5: Hata Yakalama (Error Handling) Yanlışı
`Promise`'lerde hata yakalama önemli bir konudur. `catch` bloğunun doğru şekilde yerleştirilmemesi, hataların gözden kaçmasına neden olabilir.
Yanlış Kullanım:
fetch('https://api.example.com/data')
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error(error));
Bu kullanımda, hata yakalama yalnızca `fetch` işleminin dışındaki hataları yakalar. Ancak, JSON işleme hatalarını yakalamak için özel bir hata yakalama bloğu gereklidir.
Doğru Kullanım:
fetch('https://api.example.com/data')
.then(response => {
if (!response.ok) throw new Error('Network response was not ok');
return response.json();
})
.then(data => console.log(data))
.catch(error => console.error('There was a problem with the fetch operation:', error));
Yukarıdaki örnekte, tüm potansiyel hata durumları için uygun yakalama mekanizmaları eklenmiştir.
Sonuç
JavaScript'te `Promise` kullanımı, başlangıçta karmaşık görünebilir ancak doğru kullanıldığında, asenkron işlemleri kolayca yönetebilirsiniz. Yukarıda belirttiğimiz yaygın hatalardan kaçınarak, daha sağlam ve verimli kodlar yazabilirsiniz. Unutmayın, hatalar yapabiliriz ama bu hatalardan öğrenmek, yazılım geliştirmede ilerlemenin anahtarıdır.
