Kuvien lataaminen asynkronisilla takaisinkutsuilla JavaScriptissä

Toteutetaan funktio loadImage, joka lataa kuvia. Olkoon ensimmäinen parametri tälle funktiolle polku kuvaan, ja toinen - takaisinkutsu, joka suoritetaan, kun kuva on ladattu:

javascriptloadImage('img.png', function() {
  // suoritetaan kuvan latautuessa
});

Olkoon ensimmäiseen parametriimme takaisinkutsussamme viite DOM-kuvaelementtiin, ja toiseen - virhe, jos tapahtuu poikkeustilanne:

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

Voimme käyttää funktiotamme seuraavalla tavalla:

javascriptloadImage('image.png', function(image, err) {
  document.body.append(image); // sijoita kuva latauksen yhteydessä
});

Tai poikkeustilanteen käsittelyllä:

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