Janji dalam Gaya Separa Selari dalam JavaScript

Untuk menyelesaikan masalah promise hell, sintaks khas untuk janji telah dicipta, membolehkan penulisan kod tak segerak lebih mudah - dalam gaya separa selari.

Mari kita mulakan pembelajaran tentangnya. Pertama, mari kita ambil kod dari pelajaran sebelumnya:

function func() {
	getSmth(2).then(res => {
		console.log(res); // akan memaparkan 4
	});
}

func();

Sekiranya fungsi getSmth kita adalah segerak, maka kod fungsi func kita boleh ditulis semula seperti berikut:

function func() {
	let res = getSmth(2);
	console.log(res); // akan memaparkan 4
}

Fungsi getSmth, bagaimanapun, adalah tak segerak, oleh itu kod di atas tidak akan berfungsi. Namun, dengan menggunakan gaya separa selari janji, kita boleh mencapai sesuatu yang serupa. Mari kita lakukan.

Pertama, kita mesti mengisytiharkan fungsi func kita sebagai tak segerak menggunakan arahan khas async:

async function func() {
	
}

Selepas itu, kita akan dapat menggunakan arahan khas await di dalam fungsi func. Arahan ini, jika ditulis sebelum janji, akan memaksa JavaScript menunggu sehingga janji diselesaikan. Selepas itu, arahan akan mengembalikan hasil janji, dan pelaksanaan kod akan disambung semula.

Dalam kes kita, kita mesti menulis await sebelum memanggil getSmth. Oleh kerana hasil pemanggilan fungsi ini adalah janji, maka pelaksanaan kod seterusnya hanya akan disambung semula selepas janji ini diselesaikan. Dan, hasil janji boleh disimpan dalam pembolehubah. Mari lakukan seperti yang diterangkan:

async function func() {
	let res = await getSmth(2);
	console.log(res); // akan memaparkan 4
}

func();

Mari kita panggil getSmth beberapa kali:

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

func();

Dan sekarang mari kita panggil getSmth dalam gelung:

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

Tulis semula kod berikut menggunakan sintaks separa selari:

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

func();