สมมติว่าเรามีอาร์เรย์ที่มีสององค์ประกอบ โดยทั้งคู่เป็นฟังก์ชันอะซิงโครนัส เราต้องการทำงานบางอย่าง (เช่น พิมพ์ข้อความในคอนโซล) เมื่อทั้งสองฟังก์ชันอะซิงโครนัสทำงานเสร็จแล้ว
เราสามารถแก้ปัญหานี้ได้อย่างไร?
มีหลักการพื้นฐานสองวิธีในการทำงานเมื่อฟังก์ชันอะซิงโครนัสเสร็จสิ้น:
- ใช้ Promises
- ใช้ฟังก์ชัน async/await
แต่เมื่อโค้ดต้องจัดการกับฟังก์ชันอะซิงโครนัสหลายตัว (มากกว่าหนึ่ง) ฟังก์ชัน Promise.all() ของวิธีแรกจะมีข้อได้เปรียบมากกว่า
ตัวอย่าง
โค้ดต่อไปนี้เป็นตัวอย่าง:
const arr = [
new Promise((resolve, reject) => {
setTimeout(() => {
resolve('func1 fired!');
}, 2000);
}),
new Promise((resolve, reject) => {
setTimeout(() => {
resolve('func2 fired');
}, 3000);
})
];
const lastFunction = () => {
console.log('this function should be fired at the very last');
};
Promise.all([arr[0], arr[1]]).then((resp) => {
console.log(resp);
lastFunction();
}).catch((err) => {
console.log('something unexpected happened');
});ผลลัพธ์
จะแสดงผลในคอนโซลดังนี้:
[ 'func1 fired!', 'func2 fired' ] this function should be fired at the very last
