0Pricing
JavaScript Academy · บทเรียน

การเขียนฟังก์ชัน async; try/catch; แบบขนานกับแบบลำดับ

สร้างฟังก์ชัน async รอผลลัพธ์ จับข้อผิดพลาด และเปรียบเทียบรูปแบบการทำงานตามลำดับกับแบบขนาน

การเขียนฟังก์ชัน async; try/catch; แบบขนานกับแบบลำดับ เป็นบทเรียน JavaScript Academy ฟรีบน CoddyKit นี่คือบทเรียนที่ 1 จากทั้งหมด 3 บทเรียน คุณสามารถอ่านบทเรียนทั้งหมดด้านล่างฟรี — จากนั้นลองปฏิบัติด้วยตัวคุณเองในเบราว์เซอร์พร้อมตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7 บทเรียนนี้เป็นส่วนหนึ่งของเส้นทางการเรียน JavaScript Academy และความก้าวหน้าของคุณจะซิงค์ข้ามเว็บและแอป CoddyKit คอร์ส JavaScript Academy มีบทเรียนทั้งหมด 3 บทเรียน

รู้จัก async/await

เป้าหมาย: ใช้ async/await อย่างปลอดภัย

  • สร้างฟังก์ชันแบบไม่พร้อมกัน
  • รอรับค่า
  • จัดการข้อผิดพลาดด้วยการลอง/จับข้อผิดพลาด
  • การทำงานแบบขนานเทียบกับตามลำดับ
การเขียนฟังก์ชัน async; try/catch; แบบขนานกับแบบลำดับ — ภาพประกอบ 1

ตัวช่วยพรอมิสขนาดเล็ก

สร้างตัวช่วยที่ใช้พรอมิสขนาดเล็กเพื่อทดสอบการรอรับค่า

// delay returns a Promise that resolves after ms
function delay(ms, value) {
  return new Promise(function (resolve) {
    setTimeout(function () { resolve(value); }, ms);
  });
}

// Example usage
delay(10, "ok").then(function (v) {
  console.log("delay:", v);
});
การเขียนฟังก์ชัน async; try/catch; แบบขนานกับแบบลำดับ — ภาพประกอบ 2

พื้นฐานฟังก์ชันแบบไม่พร้อมกัน

แบบไม่พร้อมกันจะระบุว่าฟังก์ชันคืนค่าพรอมิส และภายในฟังก์ชันนั้นคุณสามารถใช้ การรอรับค่าได้

// An async function can use await inside
async function greet() {
  const name = await delay(5, "Ayla");
  console.log("Hello,", name);
}

// Call it
greet();
การเขียนฟังก์ชัน async; try/catch; แบบขนานกับแบบลำดับ — ภาพประกอบ 3

การลองและจับข้อผิดพลาดพร้อมการรอรับค่า

ครอบการรอรับค่าด้วยการลอง/จับข้อผิดพลาดเมื่อขั้นตอนนั้นอาจถูกปฏิเสธ

// Simulate a failing task
function failAfter(ms, message) {
  return new Promise(function (resolve, reject) {
    setTimeout(function () { reject(new Error(message)); }, ms);
  });
}

async function runSafe() {
  try {
    const v = await failAfter(5, "boom");
    console.log("Value:", v);
  } catch (e) {
    console.log("Caught:", e.message);
  }
}

runSafe();
การเขียนฟังก์ชัน async; try/catch; แบบขนานกับแบบลำดับ — ภาพประกอบ 4

รูปแบบการทำงานตามลำดับ

ตามลำดับ: การรอรับค่าแต่ละครั้งจะรอให้ครั้งก่อนหน้าเสร็จสิ้น ทำให้เวลารวมเพิ่มขึ้น

// Sequential: total time ~ A + B
async function sequential() {
  const a = await delay(8, "A");
  const b = await delay(8, "B");
  console.log("seq:", a + b);
}

sequential();
การเขียนฟังก์ชัน async; try/catch; แบบขนานกับแบบลำดับ — ภาพประกอบ 5

การทำงานขนานด้วย all

ขนาน: เริ่มงานก่อน แล้วจึงรอ Promise.all เวลารวมประมาณ max(A, B)

// Parallel: start both, then await together
async function parallel() {
  const pa = delay(8, "A");
  const pb = delay(8, "B");
  const results = await Promise.all([pa, pb]);
  console.log("par:", results.join(""));
}

parallel();
การเขียนฟังก์ชัน async; try/catch; แบบขนานกับแบบลำดับ — ภาพประกอบ 6

แบบทดสอบการทำงานขนานกับตามลำดับ

ตรวจสอบอย่างรวดเร็ว: รูปแบบใดเร็วกว่าเมื่อเป็นงานอิสระ

การเขียนฟังก์ชัน async; try/catch; แบบขนานกับแบบลำดับ — ภาพประกอบ 7

ทบทวน

ทบทวน: คุณเขียนฟังก์ชันแบบไม่พร้อมกัน รอรับค่า จัดการข้อผิดพลาดด้วยการลอง/จับข้อผิดพลาด และเปรียบเทียบการรอรับค่าตามลำดับกับ Promise.all แบบขนานที่เร็วกว่า

การเขียนฟังก์ชัน async; try/catch; แบบขนานกับแบบลำดับ — ภาพประกอบ 8

คำถามที่พบบ่อย

บทเรียน “การเขียนฟังก์ชัน async; try/catch; แบบขนานกับแบบลำดับ” ฟรีหรือไม่

ใช่ — ข้อความเต็มของ “การเขียนฟังก์ชัน async; try/catch; แบบขนานกับแบบลำดับ” ฟรีให้อ่านที่นี่บนเว็บ เพื่อปฏิบัติแบบโต้ตอบ (ตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7) และปลดล็อคส่วนที่เหลือของคอร์ส JavaScript Academy ให้อัปเกรดเป็น CoddyKit PRO คอร์ส JavaScript Academy มีบทเรียนทั้งหมด 3 บทเรียน

คุณจะเรียนรู้อะไรในบทเรียน “การเขียนฟังก์ชัน async; try/catch; แบบขนานกับแบบลำดับ”

สร้างฟังก์ชัน async รอผลลัพธ์ จับข้อผิดพลาด และเปรียบเทียบรูปแบบการทำงานตามลำดับกับแบบขนาน คุณปฏิบัติ JavaScript Academy ด้วยโค้ดที่ใช้งานได้จริงที่คุณเรียกใช้โดยตรงในเบราว์เซอร์ และติวเตอร์ AI ตลอด 24/7 ตอบคำถามของคุณขณะที่คุณไปผ่านบทเรียน

คุณต้องมีประสบการณ์ก่อนที่จะเริ่มเรียน JavaScript Academy หรือไม่

ไม่จำเป็นต้องมีประสบการณ์มาก่อน JavaScript Academy บน CoddyKit ออกแบบมาสำหรับผู้เริ่มต้นไปจนถึงผู้เรียนขั้นสูง คุณสามารถเริ่มต้นที่นี่หรือเริ่มจากตัวแรกและเรียนด้วยความเร็วของคุณเอง นี่คือบทเรียนที่ 1 จากทั้งหมด 3 บทเรียน

บทเรียน “การเขียนฟังก์ชัน async; try/catch; แบบขนานกับแบบลำดับ” ใช้เวลานานแค่ไหน

บทเรียน CoddyKit ส่วนใหญ่ใช้เวลาประมาณ 5–10 นาที แต่ละบทเรียนจึงสั้นและเป็นแบบโต้ตอบ คุณสามารถก้าวหน้าอย่างต่อเนื่องและกลับมาเรียนต่อจากตรงที่เพิ่งหยุดบนเว็บและแอปได้เลย

ฉันเขียนและรันโค้ดในบทเรียน JavaScript Academy นี้ได้ไหม

ได้ บทเรียน JavaScript Academy ทุกบทมีตัวแก้ไขโค้ดในตัว คุณจึงเขียนและรันโค้ดจริงได้เลยในเบราว์เซอร์ และได้รับข้อเสนอแนะจาก AI ในทันที — ไม่ต้องติดตั้งในเครื่องของคุณ

บทเรียนทั้งหมดในหลักสูตรนี้

  1. การเขียนฟังก์ชัน async; try/catch; แบบขนานกับแบบลำดับ
  2. Timeout และการยกเลิกด้วย AbortController
  3. รูปแบบการลองใหม่และการหน่วงเวลาเพิ่มขึ้น
← กลับไปที่ JavaScript Academy