Piltide laadimine asünkroonsete tagasikutsetega JavaScriptis

Rakendame funktsiooni loadImage, mis laadib pilte. Olgu selle funktsiooni esimene parameeter tee pildi failini, ja teine - tagasikutse, mis käivitatakse, kui pilt on laaditud:

javascriptloadImage('img.png', function() {
  // käivitatakse pildi laadimisel
});

Olgu meie tagasikutse esimesse parameetrisse viide pildi DOM elemendile, ja teise - viga, kui tekib erandolukord:

javascriptloadImage('img.png', function(image, err) {
  console.log(image, err);
});

Me saame oma funktsiooni kasutada järgmisel viisil:

javascriptloadImage('image.png', function(image, err) {
  document.body.append(image); // asetame pildi laadimisel
});

Või koos erandolukorra töötlemisega:

javascriptloadImage('image.png', function(image, err) {
  if (!err) {
    document.body.append(image);
  } else {
    console.log('tekis viga: ' + err);
  }
});