การทำงานกับอาร์เรย์ของพรอมิสใน JavaScript

ตอนนี้เราจะมาวิเคราะห์สองเมธอดที่มีประโยชน์ ซึ่งอนุญาตให้ทำงานกับอาร์เรย์ของพรอมิส เมธอด Promise.all อนุญาตให้ดำเนินการ โค้ดเมื่อพรอมิสทั้งหมดที่ส่งเข้ามา ในรูปแบบของอาร์เรย์เสร็จสิ้น ส่วนเมธอด Promise.race รอการโหลดของพรอมิสตัวแรกจากอาร์เรย์ โดยทิ้งตัวที่เหลือ

ทั้งสองเมธอดส่งคืนพรอมิสใหม่เป็นผลลัพธ์ของตัวเอง สำหรับเมธอด Promise.all ผลลัพธ์ ของพรอมิสนี้จะเป็นอาร์เรย์ของผลลัพธ์ทั้งหมด ของพรอมิสที่ส่งเข้ามา (ลำดับของผลลัพธ์ สอดคล้องกับลำดับของพรอมิสในอาร์เรย์) และสำหรับ Promise.race - ผลลัพธ์ของพรอมิส ตัวแรกที่ทำงานเสร็จ

มาดูกันในทางปฏิบัติ สมมติว่าเรามี อาร์เรย์ของพรอมิส:

javascriptlet promises = [
  new Promise(resolve => setTimeout(() => resolve(1), 1000)),
  new Promise(resolve => setTimeout(() => resolve(2), 2000)),
  new Promise(resolve => setTimeout(() => resolve(3), 3000)),
];

มาใช้ Promise.all เพื่อรอ ให้การโหลดของพรอมิสทั้งหมดจาก อาร์เรย์ของเราเสร็จสิ้น:

javascriptPromise.all(promises).then(function(res) {
  console.log(res); // จะแสดง [1, 2, 3] - ผลลัพธ์ของพรอมิสทั้งหมด
});

และตอนนี้ใช้ Promise.race เพื่อรอ ให้การโหลดของพรอมิสตัวแรกเสร็จสิ้น:

javascriptPromise.race(promises).then(function(res) {
  console.log(res); // จะแสดง 1 - ผลลัพธ์ของพรอมิสตัวแรกที่ทำงานเสร็จ
});

หากมีพรอมิสอย่างน้อยหนึ่งตัวในอาร์เรย์ ถูกปฏิเสธ (rejected) พรอมิสที่ส่งคืนเป็นผลลัพธ์จะ เปลี่ยนสถานะเป็น rejected ทันที ดังนั้น ข้อผิดพลาดที่เกิดขึ้นสามารถดักจับได้ด้วยวิธี ปกติที่คุณเคยเรียนมาแล้ว เช่น ผ่าน catch:

javascriptPromise.all(promises).then(function(res) {
  console.log(res);
}).catch(function(err) {
  console.log(err);
});