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();