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 функциясы, алайда, асинхронды, сондықтан жоғарыда келтірілген код жұмыс істемейді. Бірақ, промисердің синхронды стилін қолданып, біз ұқсас нәрсені ала аламыз. Мұны істейік.

Алдымен біз өзіміздің функциямызды func арнайы async командасымен асинхронды деп жариялауымыз керек:

async function func() {
	
}

Осыдан кейін біз func функциясының ішінде арнайы await командасын қолдана аламыз. Бұл команда, промістен бұрын жазылған, JavaScript-ке промис орындалғанға дейін күтуге мәжбүр етеді. Осыдан кейін команда промис нәтижесін қайтарады, және кодтың орындалуы жалғасады.

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

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