JavaScript에서 break 문은 루프를 즉시 종료하고, 루프 아래에 있는 코드의 실행을 계속 이어갈 때 사용합니다. 반복 작업 도중 특정 조건이 충족되면 더 이상 나머지 반복을 진행할 필요가 없을 때 유용하게 활용됩니다.
break 문의 동작 원리
break 문은 주로 if 조건문과 함께 사용됩니다. 루프가 실행되는 동안 특정 조건이 참(true)이 되면 break 문이 호출되어 루프 전체가 즉시 종료되고, 프로그램의 흐름은 루프 바깥의 다음 코드로 넘어갑니다.
예제
아래 코드를 실행하면 JavaScript에서 루프를 중단하는 과정을 직접 확인할 수 있습니다.
<!DOCTYPE html>
<html>
<body>
<p id="test"></p>
<script>
var text = "";
var i;
for (i = 0; i < 5; i++) {
if (i === 2) {
break;
}
text += "Value: " + i + "<br>";
}
document.getElementById("test").innerHTML = text;
</script>
</body>
</html>실행 결과
Value: 0 Value: 1
코드 설명
위 예제에서 for 루프는 원래 i가 5보다 작을 때까지 총 5번(0~4) 반복하도록 설정되어 있습니다. 그러나 i가 2가 되는 순간 if 조건문 안의 break 문이 실행되면서 루프가 강제로 종료됩니다.
그 결과 화면에는 i 값이 0과 1일 때의 출력만 표시되며, i가 2 이상인 경우의 반복은 실행되지 않습니다. 루프가 종료된 후에는 document.getElementById()를 통해 결과가 웹 페이지에 출력됩니다.
참고: continue 문과의 차이
break 문이 루프 자체를 완전히 종료하는 것과 달리, continue 문은 현재 반복만 건너뛰고 다음 반복을 계속 진행합니다. 상황에 따라 두 문법을 적절히 선택하여 사용하면 반복문을 더욱 효율적으로 제어할 수 있습니다.