วิธีหยุด Loop ใน JavaScript (Break Statement)

คำสั่ง break ใช้เพื่อ หยุดลูปทันที และทำงานคำสั่งถัดไปหลังลูปต่อ

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

<!DOCTYPE html>
<html>
<body>
  <p id="test"></p>
  <script>
    var text = "";
    var i;
    for (i = 0; i < 5; i++) {
      if (i === 2) {
        break; // หยุดลูปเมื่อ i = 2
      }
      text += "Value: " + i + "<br>";
    }
    document.getElementById("test").innerHTML = text;
  </script>
</body>
</html>

ผลลัพธ์

Value: 0
Value: 1

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

1. i=0: 0 !== 2 → เพิ่ม "Value: 0"
2. i=1: 1 !== 2 → เพิ่ม "Value: 1"
3. i=2: 2 === 2 → break → ออกจากลูปทันที
4. i=3,4: ไม่ทำงาน

Break ใน Loop ต่างๆ

Break ใน Switch (จำเป็น)

switch (value) {
  case 1:
    doSomething();
    break; // ไม่มี break จะ fall-through ไป case 2
  case 2:
    doOther();
    break;
}

Break กับ Nested Loops (ใช้ Label)

outer: for (let i = 0; i < 3; i++) {
  for (let j = 0; j < 3; j++) {
    if (i === 1 && j === 1) break outer;
    console.log(i, j);
  }
}
// Output: (0,0) (0,1) (0,2) (1,0)

Best Practice: Early Return แทน Break

// ❌ Break ใน Function
function findUser(users, id) {
  for (const user of users) {
    if (user.id === id) break; // ต้อง return หลังลูป
  }
  return user; // ซับซ้อน
}

// ✅ Early Return (ชัดเจนกว่า)
function findUser(users, id) {
  for (const user of users) {
    if (user.id === id) return user; // ออกจาก Function ทันที
  }
  return null;
}