Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> JavaScript

JavaScript Switch Case: คู่มือทีละขั้นตอน

JavaScript switch case คือคำสั่ง if else แบบหลายเงื่อนไข รับนิพจน์เงื่อนไขเหมือน if statement แต่สามารถมีหลาย cases ที่ match กับผลลัพธ์ของนิพจน์เพื่อรันโค้ดบล็อกที่ต่างกัน


คำสั่งเงื่อนไขใน JavaScript

คำสั่งเงื่อนไข (conditional statements) ควบคุมการไหลของโปรแกรม รูปแบบทั่วไปคือ if และ if...else รันโค้ดก็ต่อเมื่อเงื่อนไขเป็นจริง

Switch case statement เป็นคำสั่งเงื่อนไข built-in อีกแบบหนึ่ง ใช้ตรวจสอบนิพจน์กับหลาย cases และรันโค้ดบล็อกที่ match

บทนำ: If Statement

if statement ประเมินว่า statement เป็น true หรือ false รันก็ต่อเมื่อเป็น true

var age = 17;
if (age >= 16) {
  console.log("You are aged 16 or over!");
}

ผลลัพธ์: "You are aged 16 or over!"

else if ใช้ตรวจสอบหลายเงื่อนไข

JavaScript Switch Case

switch statement ประเมินนิพจน์และรันโค้ดบล็อกที่ match

ไวยากรณ์

switch (statement) {
  case a:
    // รันโค้ด
    break;
  case b:
    // รันโค้ด
    break;
  default:
    // รันโค้ด
    break;
}

ขั้นตอนการทำงาน

  1. ประเมิน switch expression
  2. เปรียบเทียบค่ากับแต่ละ case
  3. ถ้า match รันโค้ดบล็อกนั้น
  4. ถ้าไม่มี case ไหน match รัน default

ตัวอย่าง: ราคาเครื่องดื่มกาแฟ

const drink_name = "Americano";
switch (drink_name) {
  case "Americano":
    console.log("The price of an Americano is $2.60");
    break;
  case "Cappuccino":
    console.log("The price of a cappuccino is $2.75");
    break;
  case "Macchiato":
    console.log("The price of a macchiato is $3.00");
    break;
  case "Espresso":
    console.log("The price of an espresso is $2.40");
    break;
  default:
    console.log("This drink is not available");
}

ผลลัพธ์: The price of an Americano is $2.60

สำคัญ: ใช้ break ท้ายทุก case เพื่อหยุดการตรวจสอบต่อ มิฉะนั้นโปรแกรมจะทำงานต่อไป (fall-through)

Switch Multiple Cases (หลาย cases ใช้โค้ดบล็อกเดียวกัน)

หากหลาย cases ต้องการผลลัพธ์เดียวกัน สามารถรวม case ไว้ด้วยกันได้

const drink_name = "Mocha";
switch (drink_name) {
  case "Americano":
    console.log("The price of this drink is $2.60");
    break;
  case "Cappuccino":
    console.log("The price of this drink is $2.75");
    break;
  case "Latte":
  case "Mocha":
  case "Macchiato":
    console.log("The price of this drink is $3.00");
    break;
  case "Espresso":
    console.log("The price of this drink is $2.40");
    break;
  default:
    console.log("This drink is not available");
}

กรณี drink_name = "Mocha" จะ match กับ case "Mocha" และรันโค้ดบล็อกราคา $3.00

สรุป

switch conditional statement ใช้ประเมินนิพจน์และคืนค่าตามเงื่อนไขที่ match เหมาะสำหรับหลายกรณีที่เป็นไปได้ ในบทความนี้ครอบคลุมพื้นฐาน conditional statements, switch case syntax, และ multiple cases usage