Načítání obrázků přes asynchronní callbacky v JavaScriptu
Pojďme implementovat funkci loadImage,
která bude načítat obrázky. Nechť první parametr
této funkce přijímá cestu k obrázku,
a druhý - callback, který se provede, když
obrázek bude načten:
loadImage('img.png', function() {
// provede se po načtení obrázku
});
Nechť do prvního parametru našeho callbacku přijde odkaz na DOM element obrázku, a do druhého - chyba, pokud nastane výjimečná situace:
loadImage('img.png', function(image, err) {
console.log(image, err);
});
Můžeme použít naši funkci následujícím způsobem:
loadImage('image.png', function(image, err) {
document.body.append(image); // umístíme obrázek po načtení
});
Nebo s ošetřením výjimečné situace:
loadImage('image.png', function(image, err) {
if (!err) {
document.body.append(image);
} else {
console.log('nastala chyba: ' + err);
}
});
Implementujte funkci loadImage. Použijte
k tomu dříve nastudovaný
kód pro načítání
obrázků.