Промисификација асинхроног кода у JavaScript-у

Пошто су промови у JavaScript-у релативно нова појава, неки асинхрони функционалитет можда не подржава промове. У том случају корисно је створити омотач око таквог кода у облику промиса, јер је коришћење промиса много удобније. Таква трансформација се назива промисификација.

Пример функционалитета који не подржава промове може бити учитавање слика, које смо већ разматрали у претходним лекцијама:

let image = document.createElement('img');
image.src = 'img.png';

image.addEventListener('load', function() {
	document.body.appendChild(image);
});
image.addEventListener('error', function() {
	console.log('Грешка при учитавању слике');
});

Извршимо промисификацију овог кода, обмотавши га функцијом која враћа промис:

function loadImage(path) {
	return new Promise(function(resolve, reject) {
		let image = document.createElement('img');
		image.src = path;
		
		image.addEventListener('load', function() {
			resolve(image);
		});
		image.addEventListener('error', function() {
			reject(new Error('Грешка при учитавању слике "' + path + '"'));
		});
	});
}

Моћи ћемо да користимо нашу функцију на следећи начин:

loadImage('img.png').then(function(image) {
	document.body.appendChild(image);
}).catch(function(error) {
	console.log(error);
});

Самостално, без подсматривања у мој код, извршите промисификацију учитавања слика. Тестирајте добијени код.

Нека путање до слика буду сачуване у низу:

let paths = ['img1.png', 'img2.png', 'img3.png'];

Напишите код који ће сачекати да се учитају све слике, а затим их у петљи дода на крај body-ја.

Дат је следећи код:

window.addEventListener('DOMContentLoaded', function() {
	console.log('DOM је учитан');
});

Извршите његову промисификацију.