[JavaScript] 자바스크립트 switch문 사용법 & 예제 정리

여러 개의 조건을 처리할 때 if-else문을 사용할 수도 있지만 switch문을 사용할 수도 있습니다. 스위치 문(Switch statement)은 특정 변수나 표현식의 값을 기반으로 다양한 경우(case) 중 하나를 선택하여 실행하는 조건문의 하나로써 하나의 코드만 실행한다는 뜻으로 선택문이라고도 말하기도 합니다. 

 

switch문의 장점 2가지

1. 가독성: switch문은 여러 개의 case로 분기되어 있어서 else-if보다 가독성이 좋습니다. 특히, 비교하려는 값이 많고 조건에 만족하였을 때 실행하는 코드가 적을 때 switch문을 사용하면 코드를 깔끔하게 유지할 수 있습니다.
2. 동등 비교 강제 : switch문에서는 기본적으로 값과 case문의 값이 '===`로 비교됩니다. 이는 자료형과 값이 모두 같아야만 일치하므로 엄격한 비교를 수행하여 프로그래밍적 실수를 예방합니다.

 

---

 

 switch문 사용법 

switch문 문법

switch (expression) {
    case value1:
        // expression이 value1과 일치할 때 실행되는 코드
        break;
    case value2:
        // expression이 value2와 일치할 때 실행되는 코드
        break;
    // 추가적인 case 문 ...
    default:
        // 위의 어떤 경우에도 해당하지 않을 때 실행되는 코드
}

변수에 저장된 값과 switch문에 있는 경우(case)의 값을 검사하여 변수와 경우의 값에서 일치하는 값이 있을 때 그에 해당하는 코드를 실행합니다.

• expression: 평가할 표현식 또는 변수.
• case value: expression이 특정 값과 일치할 때 해당 case의 코드 블록이 실행됩니다.
• break: 각 case 블록의 마지막에 사용되며, switch 문을 종료합니다. break가 없으면 해당 case 이후의 모든 코드가 실행됩니다.
• default: 어떤 case에도 해당하지 않을 때 실행되는 코드 블록입니다. 선택적으로 사용할 수 있습니다.

 

switch문 사용 예시

See the Pen switch문 by wjdxo513 (@wjdxo513) on CodePen.

 

위의 예제에서 day 변수의 값이 "월"일 때 첫 번째 case, "화"일 때 두 번째 case, "수"일 때 세 번째 case가 실행되고, 해당하는 문자열을 추가합니다. 만약 어떤 case에도 해당하지 않으면 default 블록이 실행됩니다.

 

 

switch문을 사용할 때 주의사항

1. 각 case 블록의 마지막에 break를 사용하여 switch 문을 종료해야 합니다. 그렇지 않으면 일치하는 case 이후의 모든 코드가 실행됩니다.
2. 일치하는 값: case 문은 일치하는 값을 찾아 실행됩니다. 정확한 일치(===)를 기준으로 판단하므로 형 변환이 일어나지 않습니다.
3. 스위치 문은 실행하는 코드가 간결할 때는 if-else보다 가독성이 좋을 수 있고, 코드의 양이 많은 경우에는 오히려 가독성을 해칠 수 있습니다. 이럴 때는 switch보다는 if-else를 사용하는 것이 좋습니다.