Chargement d'images via des callbacks asynchrones en JavaScript
Implémentons la fonction loadImage,
qui chargera des images. Laissez le premier
paramètre de cette fonction accepter le chemin vers l'image,
et le second - un callback qui s'exécutera lorsque
l'image sera chargée :
loadImage('img.png', function() {
// s'exécutera au chargement de l'image
});
Laissez le premier paramètre de notre callback recevoir une référence à l'élément DOM de l'image, et le second - une erreur, si une situation exceptionnelle se produit :
loadImage('img.png', function(image, err) {
console.log(image, err);
});
Nous pouvons utiliser notre fonction de la manière suivante :
loadImage('image.png', function(image, err) {
document.body.append(image); // placerons l'image une fois chargée
});
Ou bien avec le traitement d'une situation exceptionnelle :
loadImage('image.png', function(image, err) {
if (!err) {
document.body.append(image);
} else {
console.log('une erreur s\'est produite : ' + err);
}
});
Implémentez la fonction loadImage. Utilisez
pour cela le
code pour le chargement
d'images que vous avez étudié précédemment.