JavaScript에서 switch 문은 하나의 표현식을 평가하고, 그 결과값에 따라 여러 개의 서로 다른 코드 블록 중 하나를 실행하기 위한 제어문입니다. 인터프리터는 표현식의 값을 각 case와 하나씩 비교하며 일치하는 조건을 찾고, 어디에도 해당하지 않으면 default 블록이 실행됩니다.
동일한 변수를 여러 값과 반복해서 비교해야 하는 상황이라면, if...else if 문을 여러 번 나열하는 것보다 switch 문을 사용하는 것이 코드의 가독성과 실행 효율 면에서 모두 더 유리합니다.
기본 문법
switch(expression) {
case condition1: statement(s)
break;
case condition2: statement(s)
break;
...
case conditionN: statement(s)
break;
default: statement(s)
}break 문의 역할
각 case 끝에 위치한 break 문은 해당 case의 실행을 종료하고 switch 블록을 빠져나가는 역할을 합니다. 만약 break를 생략하면, 일치하는 case 이후의 나머지 case들에 있는 문장들이 조건과 관계없이 연달아 실행되는 이른바 'fall-through' 현상이 발생하므로 주의해야 합니다.
예제
아래 예제를 직접 실행해 보면 JavaScript에서 switch...case 문이 어떻게 동작하는지 쉽게 이해할 수 있습니다. 학생의 등급(grade) 값에 따라 서로 다른 메시지가 출력됩니다.
<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>출력 결과
위 코드에서 변수 grade의 값이 'A'이므로, 첫 번째 case에 해당하는 "Good job"이 출력된 후 break 문에 의해 switch 블록이 즉시 종료됩니다. 최종 출력 결과는 다음과 같습니다.
Entering switch block Good job Exiting switch block
정리
switch 문은 하나의 값을 기준으로 분기 처리가 필요할 때 if...else if 문보다 구조가 명확하고 깔끔하게 코드를 작성할 수 있도록 도와줍니다. 단, 각 case마다 break 문을 빠뜨리지 않도록 주의하고, 어떤 case에도 일치하지 않는 경우를 대비해 default 블록을 함께 작성하는 것이 좋은 습관입니다.