JavaScript'te Asenkron Kodun Promise'e Dönüştürülmesi

Promise'ler JavaScript'e nispeten yeni eklendiğinden, bazı asenkron işlevler promise'leri desteklemeyebilir. Bu durumda, promise'leri kullanmak çok daha kolay olduğundan, böyle bir kodun üzerine bir promise katmanı oluşturmak faydalıdır. Bu dönüştürme işlemine promisification (promise'e dönüştürme) denir.

Promise'leri desteklemeyen bir işleve örnek olarak, önceki derslerde ele aldığımız resim yüklemeyi verebiliriz:

javascriptlet image = document.createElement('img');
image.src = 'img.png';

image.addEventListener('load', function() {
  document.body.appendChild(image);
});
image.addEventListener('error', function() {
  console.log('image load error');
});

Şimdi bu kodu, onu bir promise döndüren bir fonksiyonun içine alarak promise'e dönüştürelim:

javascriptfunction loadImage(path) {
  return new Promise(function(resolve, reject) {
    let image = document.createElement('img');
    image.src = path;
    
    image.addEventListener('load', function() {
      resolve(image);
    });
    image.addEventListener('error', function() {
      reject(new Error('"' + path + '" resmi yüklenirken hata oluştu'));
    });
  });
}

Fonksiyonumuzu aşağıdaki şekilde kullanabileceğiz:

javascriptloadImage('img.png').then(function(image) {
  document.body.appendChild(image);
}).catch(function(error) {
  console.log(error);
});

javascriptlet paths = ['img1.png', 'img2.png', 'img3.png'];

javascriptwindow.addEventListener('DOMContentLoaded', function() {
  console.log('dom yüklendi');
});