JavaScript-тегі promise hell мәселесі

Сіз промисердің callback hell мәселесін шешу үшін жасалғанын білесіз. Алайда, уақыт өте келе промисердің де қиын код тудыра алатыны анықталды. Бұл мәселе ұқсастық бойынша promise hell деп аталды.

Бұл мәселені код мысалдарында қарастырайық. Бізде getSmth функциясы бар делік, ол параметр алып, сол параметрге байланысты нәтиже қайтарады:

function getSmth(num) {
	return new Promise((resolve, reject) => {
		setTimeout(() => resolve(num * num), 1000)
	});
}

Бұл жағдайда біз пайдалы операцияны (мысалы, серверден деректер алу) имитациялаймыз. Имитация ретінде біз параметр ретінде санды жібереміз және бір секундтан кейін оның квадратын қайтарамыз.

Енді біздің getSmth функциямызды басқа функция ішінде қолданайық:

function func() {
	getSmth(2).then(res => {
		console.log(res); // 4 шығарады
	});
}

func();

Бірінші мәселе

Бірінен соң бірі келетін көптеген then құрылымдары кодты түсінуді қиындатады:

function func(){
	getSmth(2).then(res1 => {
		// бірнәрсе істейміз
	}).then(res2 => {
		// бірнәрсе істейміз
	}).then(res3 => {
		// бірнәрсе істейміз
	}).then(res4 => {
		// бірнәрсе істейміз
	}).then(res5 => {
		// бірнәрсе істейміз
	}).then(res6 => {
		// бірнәрсе істейміз
	});
}

func();

Екінші мәселе

Басқа түрдегі мәселе де бар. Енді біз функциямызды екі рет қолданып, содан кейін нәтижелерін қосқымыз келеді. Нәтижесінде бізге мынадай код шығады:

function func() {
	getSmth(2).then(res1 => {
		getSmth(3).then(res2 => {
			console.log(res1 + res2); // 13 шығарады
		});
	});
}

func();

Қазірдің өзінде callback hell еске түсіріп тұрған жоқ па? Тағы бір функция шалуды қосайық - код одан да нашарлайды:

function func() {
	getSmth(2).then(res1 => {
		getSmth(3).then(res2 => {
			getSmth(4).then(res3 => {
				console.log(res1 + res2 + res3);
			});
		});
	});
}

func();

Әрине, Promise.all қолдануға болады:

function func() {
	Promise.all([getSmth(2), getSmth(3), getSmth(4)]).then(res => {
		console.log(res[0] + res[1] + res[2]);
	});
}

func();

Алайда, біз бірдей нәтиже алдық па? Жоқ! Бірінші жағдайда әрбір жаңа функция алдыңғы промис аяқталуын күтеді, ал екінші жағдайда - барлық промисер бір уақытта орындалады. Бұл айырмашылық біз келесі функцияға алдыңғы шалуды жібергіміз келгенде маңызды болады:

function func() {
	getSmth(2).then(res1 => {
		getSmth(res1).then(res2 => {
			getSmth(res2).then(res3 => {
				console.log(res3);
			});
		});
	});
}

func();