Asenkron Programlama Nedir?
Callback Hell: Asenkron Kodun Karabasanı
kopyalafetch('https://api.example.com/data') .then(response => response.json()) .then(data => { // Veriyi işleme console.log(data); }) .catch(error => console.log('Hata:', error));
Ancak işler büyüdükçe, callback'lerin birbiriyle iç içe geçmesi kaçınılmaz hale gelir. İşte callback hell de tam burada başlar:
kopyalafetch('https://api.example.com/data') .then(response => response.json()) .then(data => { fetch('https://api.example.com/other-data') .then(response => response.json()) .then(otherData => { // Diğer veriyi işleme fetch('https://api.example.com/another-data') .then(response => response.json()) .then(anotherData => { // Üçüncü veriyi işleme console.log(anotherData); }) .catch(error => console.log('Hata:', error)); }) .catch(error => console.log('Hata:', error)); }) .catch(error => console.log('Hata:', error));
Evet, gördüğünüz gibi her şey birbirine bağlı hale geldi. Callback'ler iç içe geçmiş, kodunuz karmaşıklaşmış ve okunabilirlik sıfıra düşmüş durumda. Şimdi burada devreye Promises giriyor.
Promiselar ile Dönem Değişiyor: Callback Hell’den Kurtulun!
Örnek olarak yukarıdaki callback hell'i, promiselar kullanarak nasıl daha anlaşılır hale getirebiliriz?
kopyalafetch('https://api.example.com/data') .then(response => response.json()) .then(data => { return fetch('https://api.example.com/other-data'); }) .then(response => response.json()) .then(otherData => { return fetch('https://api.example.com/another-data'); }) .then(response => response.json()) .then(anotherData => { console.log(anotherData); }) .catch(error => console.log('Hata:', error));
Bu yöntemle kodunuzu daha okunabilir ve bakımı kolay bir hale getirebilirsiniz. Ancak bu kadarla kalmıyor! JavaScript’in sunduğu async/await yapısını kullanarak asenkron işlemleri senkron hale getirebilir, kodunuzu neredeyse tamamen senkron bir hale getirebilirsiniz.
Async/Await ile Asenkron Kod Yazmanın Kolay Yolu
İşte async/await kullanarak yazılmış bir örnek:
kopyalaasync function getData() { try { let response = await fetch('https://api.example.com/data'); let data = await response.json(); response = await fetch('https://api.example.com/other-data'); let otherData = await response.json(); response = await fetch('https://api.example.com/another-data'); let anotherData = await response.json(); console.log(anotherData); } catch (error) { console.log('Hata:', error); } } getData();
Bu yöntemle, kodunuzun akışını neredeyse sıralı bir şekilde yazabilirsiniz ve asenkron programlamanın karmaşasından kurtulmuş olursunuz.