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

คำสั่ง if...else if...else เป็นรูปแบบขยายของ if...else ที่ช่วยให้ JavaScript ตัดสินใจจากหลายเงื่อนไขตามลำดับ เงื่อนไขจะถูกตรวจสอบจากบนลงล่าง เมื่อเจอเงื่อนไขที่เป็น true จะรันบล็อกนั้นแล้วข้ามส่วนที่เหลือ

ไวยากรณ์

if (condition1) {
  // รันเมื่อ condition1 เป็น true
} else if (condition2) {
  // รันเมื่อ condition1 false และ condition2 true
} else if (condition3) {
  // รันเมื่อ condition1,2 false และ condition3 true
} else {
  // รันเมื่อทุกเงื่อนไข false
}

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

<html>
<body>
  <script>
    var book = "maths";
    if (book == "history") {
      document.write("<b>History Book</b>");
    } else if (book == "maths") {
      document.write("<b>Maths Book</b>");
    } else if (book == "economics") {
      document.write("<b>Economics Book</b>");
    } else {
      document.write("<b>Unknown Book</b>");
    }
  </script>
</body>
</html>

การทำงานแบบทีละขั้นตอน

1. ตรวจสอบ book == "history" → false
2. ตรวจสอบ book == "maths" → true → รันบล็อกนี้ แล้วข้าม else if/else ที่เหลือ
3. ไม่ตรวจสอบ economics หรือ default

แนวทางปฏิบัติที่ดี (Best Practices)

• จัดลำดับเงื่อนไขจาก เฉพาะเจาะจงไปทั่วไป (Specific to General)
• ใช้ === (Strict Equality) แทน == เพื่อป้องกันบั๊กจาก Type Coercion
• ถ้ามีเงื่อนไขมาก (>5) พิจารณาใช้ switch หรือ Lookup Object/Map แทน
• ใส่ else สุดท้ายเสมอเพื่อจับกรณีที่ไม่คาดคิด

รูปแบบย่อ (Ternary Operator) สำหรับเงื่อนไขง่าย

// แทน if-else สั้นๆ
var result = (score >= 50) ? "Pass" : "Fail";

// ซ้อนได้แต่ไม่แนะนำ (อ่านยาก)
var grade = score >= 90 ? "A" : score >= 80 ? "B" : "C";

ข้อผิดพลาดที่พบบ่อย

• ลืม else ทำให้รันหลายบล็อกได้ (ถ้าไม่ได้ใช้ return/break)
• ใช้ = แทน == หรือ === ในเงื่อนไข
• เงื่อนไขซับซ้อนเกินไป ควรแยกเป็นฟังก์ชันหรือตัวแปรช่วย