Promiser i synkron stil i JavaScript

For å løse problemet med promise hell ble det utviklet en spesiell syntaks for promiser som tillater skriving av asynkron kode mye enklere - i synkron stil.

La oss begynne å studere den. Til å begynne med la oss ta koden fra forrige leksjon:

function func() {
	getSmth(2).then(res => {
		console.log(res); // vil skrive ut 4
	});
}

func();

Hvis funksjonen vår getSmth var synkron, kunne vi ha omskrevet koden til funksjonen func på følgende måte:

function func() {
	let res = getSmth(2);
	console.log(res); // vil skrive ut 4
}

Funksjonen getSmth er imidlertid asynkron, så koden ovenfor vil ikke fungere. Men ved å bruke synkron stil for promiser, kan vi oppnå noe som ligner. La oss gjøre det.

Først må vi deklarere funksjonen vår func som asynkron ved hjelp av et spesielt kommando async:

async function func() {
	
}

Etter dette vil vi inne i funksjonen func kunne bruke et spesielt kommando await. Dette kommandoet, skrevet foran et promise, vil tvinge JavaScript til å vente inntil promiset er fullført. Deretter vil kommandoen returnere resultatet av promiset, og kodekjøringen vil fortsette.

I vårt tilfelle må vi skrive await foran kallet til getSmth. Siden resultatet av å kalle denne funksjonen vil være et promise, vil videre kodekjøring bare fortsatte etter at dette promiset er fullført. Vel, og resultatet av promiset kan lagres i en variabel. La oss gjøre det som er beskrevet:

async function func() {
	let res = await getSmth(2);
	console.log(res); // vil skrive ut 4
}

func();

La oss kalle getSmth flere ganger:

async function func() {
	let res1 = await getSmth(2);
	let res2 = await getSmth(3);
	
	console.log(res1 + res2); // vil skrive ut 13
}

func();

Og la oss nå kalle getSmth i en løkke:

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

Omskriv følgende kode via synkron syntaks:

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

func();