Carregando imagens através de callbacks assíncronos em JavaScript

Vamos implementar a função loadImage, que irá carregar imagens. Deixe o primeiro parâmetro desta função receber o caminho para a imagem, e o segundo - um callback que será executado quando a imagem for carregada:

javascriptloadImage('img.png', function() {
  // será executado quando a imagem carregar
});

Deixe o primeiro parâmetro do nosso callback receber a referência ao elemento DOM da imagem, e o segundo - um erro, se ocorrer uma situação excepcional:

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

Podemos usar nossa função da seguinte forma:

javascriptloadImage('image.png', function(image, err) {
  document.body.append(image); // colocaremos a imagem quando carregar
});

Ou com o tratamento da situação excepcional:

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