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

คำสั่ง Switch...case ใน JavaScript คืออะไร?


คำสั่ง switch ใช้เพื่อ ประเมินนิพจน์หนึ่งแล้วเปรียบเทียบกับหลาย case เพื่อเลือกบล็อกโค้ดที่จะรัน ใช้แทน if...else if ซ้อนๆ ได้อย่างมีประสิทธิภาพและอ่านง่ายกว่า

ไวยากรณ์

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

ตัวอย่างโค้ด

<html>
<body>
  <script>
    var grade = 'A';
    document.write("Entering switch block<br />");
    switch(grade) {
      case 'A': document.write("Good job<br />"); break;
      case 'B': document.write("Pretty good<br />"); break;
      case 'C': document.write("Passed<br />"); break;
      case 'D': document.write("Not so good<br />"); break;
      case 'F': document.write("Failed<br />"); break;
      default: document.write("Unknown grade<br />")
    }
    document.write("Exiting switch block");
  </script>
</body>
</html>

การทำงานของ break และ fall-through

  • break: ออกจาก switch ทันทีหลังรัน case นั้น (พฤติกรรมปกติ)
  • ไม่มี break: จะ fall-through ไปทำ case ถัดไปต่อเนื่องจนกว่าจะเจอ break หรือจบ switch

ตัวอย่าง Fall-through ขึ้นใจ

var fruit = "apple";
switch (fruit) {
  case "apple":
  case "mango":
  case "banana":
    console.log("ผลไม้ชนิดนี้มีวิตามินสูง");
    break;
  case "carrot":
    console.log("ผัก");
    break;
  default:
    console.log("ไม่รู้จัก");
}

การเปรียบเทียบ: Strict Equality (===)

switch ใช้ Strict Equality (===) ในการเปรียบเทียบ ไม่มีการแปลงชนิด (Type Coercion)

var x = "10";
switch (x) {
  case 10:   // ไม่ตรง! (Number vs String)
    console.log("Number 10");
    break;
  case "10": // ตรง!
    console.log("String '10'");
    break;
}

เมื่อไหร่ควรใช้ switch

  • มีเงื่อนไขเยอะ (if...else if > 3-4 ระดับ)
  • เปรียบเทียบค่าเดียวกับหลายค่าคงที่
  • ต้องการ fall-through ขึ้นใจ
  • โค้ดจะอ่านง่ายและบำรุงรักษาง่ายกว่า

ข้อจำกัด

  • ไม่สามารถใช้เงื่อนไขซับซ้อนได้ (เช่น case x > 10: ไม่ได้)
  • case ต้องเป็นค่าคงที่ (Literal หรือ Constant)
  • duplicate case จะใช้ตัวแรกที่เจอ