JavaScript'те синхрондук стилдеги промисстер

Promise hell көйгөйүн чечүү үчүн атайын промис синтаксиси түзүлгөн, ал асинхрондук кодду бир кыйла жеңил - синхрондук стилде жазууга мүмкүндүк берет.

Аны үйрөнүүгө киришели. Башында мурдагы сабактан кодду алалы:

function func() {
	getSmth(2).then(res => {
		console.log(res); // 4 деп чыгарат
	});
}

func();

Эгерде биздин getSmth функциябыз синхрондук болсо, анда func функциясынын кодун төмөнкүчө кайра жаза алабыз:

function func() {
	let res = getSmth(2);
	console.log(res); // 4 деп чыгарат
}

getSmth функциясы, бирок, асинхрондук, ошондуктан жогоруда көрсөтүлгөн код иштей бербейт. Бирок, промисстердин синхрондук стилин колдонуп, биз ушуга окшош нерсени ала алабыз. Муну жасайлы.

Башында биз атайын async командасы менен өзүбүздүн функциябызды func асинхрондук деп жарыялашыбыз керек:

async function func() {
	
}

Андан кийин биз func функциясынын ичинде атайын await командасын колдоно алабыз. Промистин алдына жазылган бул команда, JavaScript'ти промис аткарылганга чейин күтүүгө мажбурлайт. Андан кийин команда промисстин натыйжасын кайтарат жана коддун аткарылышы улантылат.

Биздин учурда, getSmth чакыруусунун алдына await жазышыбыз керек. Анткени бул функцияны чакыруунун натыйжасы промис болот, ошондо коддун кийинки аткарылышы ушул промис аткарылгандан кийин гана улантылат. Ал эми промисстин натыйжасын өзгөрмөгө жаза алабыз. Сүрөттөлгөндү жасайлы:

async function func() {
	let res = await getSmth(2);
	console.log(res); // 4 деп чыгарат
}

func();

Келгиле, getSmth бир нече жолу чакыралы:

async function func() {
	let res1 = await getSmth(2);
	let res2 = await getSmth(3);
	
	console.log(res1 + res2); // 13 деп чыгарат
}

func();

Эми getSmth циклдин ичинде чакыралы:

async function func() {
	let arr = [1, 2, 3, 4, 5];
	let sum = 0;
	
	for (let elem of arr) {
		sum += await getSmth(elem);
	}
	
	console.log(sum);
}

func();

Төмөнкү кодду синхрондук синтаксис аркылуу кайра жазыңыз:

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

func();