Control Flow

1. switch คืออะไรและแก้ปัญหาอะไร

switch เป็น control flow statement ที่ใช้เปรียบเทียบค่าหนึ่งกับหลายกรณี (case) แล้วรันโค้ดของ case ที่ตรงกัน ปัญหาที่ switch แก้ได้คือ: เมื่อต้องเขียน if/else if ซ้อนกันหลายชั้นสำหรับเปรียบเทียบค่าเดียวกัน โค้ดจะยาวและอ่านยาก switch ทำให้โค้ดกระชับและชัดเจนกว่า

2. Mental Model — โต๊ะจัดเส้นทาง

ลองนึกภาพโต๊ะประชาสัมพันธ์ที่รับบัตรคิว: • คุณส่งค่าให้ switch (เหมือนส่งบัตรคิว) • switch ไล่ดู case ทีละอัน: "บัตรนี้ตรงกับ case A ไหม? B ไหม? C ไหม?" • เมื่อพบ case ที่ตรง → รันโค้ดของ case นั้น • break → ออกจาก switch ทันที • ถ้าไม่มี case ตรงเลย → ไปที่ default (เหมือนช่อง 'อื่น ๆ')

3. โครงสร้าง switch

switch (expression) {
  case value1:
    // โค้ดที่รันเมื่อ expression === value1
    break;
  case value2:
    // โค้ดที่รันเมื่อ expression === value2
    break;
  default:
    // โค้ดที่รันเมื่อไม่มี case ตรงเลย
    break;
}

4. ตัวอย่างทีละขั้น — วันในสัปดาห์

สมมติต้องการแสดงชื่อวันภาษาไทยจากตัวเลข 1–7:

• รับค่า dayNumber เช่น 3
• switch เปรียบเทียบ dayNumber กับแต่ละ case ด้วย ===
• case 3 ตรงกัน → เข้าไปรันโค้ด: dayName = "พุธ"
• พบ break → หยุดทำงาน ออกจาก switch ทันที
• ไม่รัน case 4, 5, 6, 7 หรือ default

let dayNumber = 3;
let dayName;

switch (dayNumber) {
  case 1:
    dayName = "จันทร์";
    break;
  case 2:
    dayName = "อังคาร";
    break;
  case 3:
    dayName = "พุธ";
    break;
  case 4:
    dayName = "พฤหัสบดี";
    break;
  case 5:
    dayName = "ศุกร์";
    break;
  case 6:
    dayName = "เสาร์";
    break;
  case 7:
    dayName = "อาทิตย์";
    break;
  default:
    dayName = "ไม่ถูกต้อง";
    break;
}

console.log(dayName); // "พุธ"

5. Fall-through — เมื่อลืม break

Fall-through คือพฤติกรรมที่ switch "ไหล" ต่อไปรัน case ถัดไปโดยไม่หยุด เกิดเมื่อไม่มี break บางครั้งใช้ fall-through โดยตั้งใจ เช่น รวมหลาย case ให้รันโค้ดเดียวกัน แต่ถ้าลืม break โดยไม่ตั้งใจ จะเป็น bug ที่หาได้ยาก

let day = "เสาร์";
let type;

switch (day) {
  case "จันทร์":
  case "อังคาร":
  case "พุธ":
  case "พฤหัสบดี":
  case "ศุกร์":
    type = "วันทำงาน";
    break;
  case "เสาร์":
  case "อาทิตย์":
    type = "วันหยุด";
    break;
  default:
    type = "ไม่รู้จักวัน";
}

console.log(type); // "วันหยุด"

6. switch vs if/else — เลือกอันไหนดี?

7. สรุป

• switch เปรียบเทียบค่ากับหลาย case ด้วย === เสมอ
• ทุก case ควรจบด้วย break เพื่อป้องกัน fall-through โดยไม่ตั้งใจ
• default รันเมื่อไม่มี case ตรงเลย — ควรมีเสมอเพื่อจัดการกรณีพิเศษ
• Fall-through ใช้ประโยชน์ได้เมื่อต้องการรวมหลาย case ให้รันโค้ดเดียวกัน
• ใช้ switch เมื่อเปรียบเทียบค่าเดียวกับหลายกรณี, ใช้ if/else เมื่อมีเงื่อนไขแบบ range

Lab 1: switch แสดงชื่อวัน

เป้าหมาย: ฝึกใช้ switch แบบพื้นฐานเพื่อตรวจค่าหนึ่งกับหลายกรณี มีให้แล้ว: `dayNumber = 5` และตัวแปร `dayName` สิ่งที่ต้องทำ: เขียน switch กำหนดชื่อวันให้ตรงกับตัวเลข และอย่าลืม break ในแต่ละ case ผลที่ควรเห็น: output แสดง "ศุกร์"

Lab 2: Fall-through — จัดกลุ่ม case

เป้าหมาย: ฝึกใช้ fall-through เพื่อรวมหลาย case ให้ได้ผลลัพธ์เดียวกัน มีให้แล้ว: `season = "มีนาคม"` และตัวแปร `seasonName` สิ่งที่ต้องทำ: จัดกลุ่มเดือนด้วย switch โดยวาง case ที่ต้องใช้ผลเดียวกันติดกัน ผลที่ควรเห็น: output แสดง "ร้อน"

Lab 3: switch แปลง error code

เป้าหมาย: ฝึกใช้ switch แปลง code ให้เป็นข้อความที่อ่านง่าย มีให้แล้ว: `statusCode = 404` และตัวแปร `statusMessage` สิ่งที่ต้องทำ: กำหนดข้อความให้ตรงกับ HTTP status code ที่โจทย์กำหนด ผลที่ควรเห็น: output แสดง "Not Found"

Lab 4: switch เลือกชื่อแพ็กเกจ

เป้าหมาย: ฝึกใช้ switch แปลง code สั้น ๆ ให้เป็นชื่อแพ็กเกจที่อ่านง่าย มีให้แล้ว: `planCode = "pro"` และตัวแปร `planName` สิ่งที่ต้องทำ: เขียน case สำหรับแพ็กเกจ free, pro, team และจัดการกรณีอื่นด้วย default ผลที่ควรเห็น: output แสดง "Pro"

Lab 5: ใช้ default เมื่อไม่มี case ตรง

เป้าหมาย: ฝึกใช้ default เพื่อจัดการค่าที่ไม่ตรงกับ case ใดเลย มีให้แล้ว: `role = "guest"` และตัวแปร `permission` สิ่งที่ต้องทำ: เขียน switch สำหรับสิทธิ์ admin, editor, viewer และให้ค่าอื่นตกไปที่ default ผลที่ควรเห็น: output แสดง "ไม่มีสิทธิ์"

Lab 6: switch กำหนดราคาตามขนาด

เป้าหมาย: ฝึกใช้ switch เลือกตัวเลข แล้วนำไปประกอบข้อความ มีให้แล้ว: `size = "M"`, `price` และ `message` สิ่งที่ต้องทำ: กำหนดราคาให้ตรงกับขนาดสินค้า แล้วสร้างข้อความราคา ผลที่ควรเห็น: output แสดง "ราคา 250 บาท"

Lab 7: switch เปรียบเทียบแบบ strict

เป้าหมาย: เห็นชัดว่า switch เปรียบเทียบค่าแบบ strict ด้วย === มีให้แล้ว: `code = "1"` และตัวแปร `result` สิ่งที่ต้องทำ: เขียน case ทั้งแบบ number และ string แล้วดูว่า switch เลือกอันที่ชนิดตรงกันเท่านั้น ผลที่ควรเห็น: output แสดง "string one"

Lab 8: รวมหลาย case ด้วย fall-through

เป้าหมาย: ฝึกใช้ fall-through รวมหลายค่าให้ได้คำตอบเดียวกัน มีให้แล้ว: `day = "อาทิตย์"` และตัวแปร `dayType` สิ่งที่ต้องทำ: จัดกลุ่มวันทำงานกับวันหยุดด้วย switch ผลที่ควรเห็น: output แสดง "วันหยุด"

Lab 9: switch แปลงคำสั่งเป็นสถานะ

เป้าหมาย: ฝึกใช้ switch แปลงคำสั่งสั้น ๆ ให้เป็นข้อความสถานะ มีให้แล้ว: `command = "pause"` และตัวแปร `status` สิ่งที่ต้องทำ: เขียน case สำหรับ start, pause, stop และกรณีอื่นด้วย default ผลที่ควรเห็น: output แสดง "หยุดชั่วคราว"

Lab 10: สร้างข้อความจากผล switch

เป้าหมาย: ฝึกใช้ switch เลือกค่าก่อน แล้วค่อยนำไปต่อเป็นข้อความ มีให้แล้ว: `theme = "dark"`, `themeLabel` และ `message` สิ่งที่ต้องทำ: กำหนดชื่อโหมดจาก theme แล้วสร้างข้อความสรุป ผลที่ควรเห็น: output แสดง "เลือก: โหมดมืด"