Uwekezaji wa Asynchronous Code kuwa Promise katika JavaScript

Kwa kuwa Promise zimeibuka katika JavaScript si muda mrefu sana, baadhi ya utendakazi wa asynchronous huenda usiunge mkono Promise. Katika hali kama hiyo ni muhimu kuunda kifuniko juu ya code kama hiyo kwa mfumo wa Promise, kwani matumizi ya Promise ni rahisi zaidi. Mabadiliko kama haya yanaitwa uwekezaji kuwa Promise.

Mfano wa utendakazi ambao haungii mkono Promise, unaweza kuwa upakiaji wa picha, ambao tumeizoea katika masomo yaliyopita:

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');
});

Wacha tufanye uwekezaji wa code hii kuwa Promise, tukiifunga ndani ya funkciyo, itakayorudisha Promise:

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('image "' + path + '"  load error'));
    });
  });
}

Tutaweza kutumia funkciyo yetu kwa njia ifuatavyo:

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 imepakizwa');
});