'async/await' ใน JavaScript : แยกย่อยง่าย

Apr 11 2023
ฉันมีช่วงเวลาที่ยากลำบากในการเรียนรู้แนวคิด async & wait ใน JavaScript นั่นคือเหตุผลที่ฉันต้องการอธิบายที่นี่ให้ง่ายที่สุดเท่าที่จะทำได้ เพื่อที่คุณจะไม่พบว่ามันยากเลย: สำหรับฟังก์ชัน async ฉันคิดว่าคุณรู้อยู่แล้วเกี่ยวกับ Promises ใน JS ถ้าไม่ใช่ โปรดอ่านเกี่ยวกับสัญญาใน JavaScript ที่นี่: https://amitabhiam.medium
async() => { กำลังรอ }

ฉันมีช่วงเวลาที่ยากลำบากในการเรียนรู้แนวคิด async & wait ใน JavaScript นั่นคือเหตุผลที่ฉันต้องการอธิบายที่นี่ให้ง่ายที่สุดเท่าที่จะทำได้ เพื่อที่คุณจะไม่พบว่ามันยากเลย:

สำหรับฟังก์ชัน async ฉันคิดว่าคุณรู้เกี่ยวกับ Promises ใน JS อยู่แล้ว ถ้าไม่ใช่ โปรดอ่านเกี่ยวกับสัญญาใน JavaScript ที่นี่:

https://amitabhiam./i-promise-this-way-promise-won-t-break-your-heart-in-javascript-promises-727747b8a6ec

ฟังก์ชัน async :

ฟังก์ชันสามารถสร้าง async ได้โดยใช้คีย์เวิร์ด 'async' สามารถมีนิพจน์ 'รอ' เป็นศูนย์หรือมากกว่า

ทำงานร่วมกับ Promise เพื่อหลีกเลี่ยงสถานการณ์ .then() หลายรายการในสายสัญญาหรือเพื่อเขียนพฤติกรรมตามคำสัญญาในลักษณะที่ชัดเจน

การประกาศ : สามารถประกาศโดยใช้ 'ฟังก์ชัน async' โดยที่คำหลัก 'รอ' ได้รับอนุญาตภายในเนื้อหาของฟังก์ชัน

การแสดงออกที่รอคอยจะระงับการดำเนินการจนกว่าคำสัญญาที่ส่งคืนจะสำเร็จหรือถูกปฏิเสธ จึงทำให้ฟังก์ชันสัญญาทำงานแบบซิงโครนัส

การรอจะใช้ได้ภายในฟังก์ชัน async เท่านั้น

ตัวอย่างการใช้สัญญา:

function resolveAfter6Second() {
    console.log("starting a slow promise");
    return new Promise ((resolve) => {
        setTimeout( function () {
            resolve("slow");
            console.log("This is slow promise");
        }, 6000);
    } );
}

function resolveAfter3Second() {
    console.log("starting fast promise");
    return new Promise((resolve) => {
      setTimeout(() => {
        resolve("fast");
        console.log("fast promise is done");
      }, 3000);
    });
  }


async function sequentialStart() {
    console.log("performing Sync Operation");

    const slow = await resolveAfter6Second();
    console.log(slow);

    const fast = await resolveAfter3Second();
    console.log(fast);
}

sequentialStart();