[JavaScript] 자바스크립트 조건문 사용하기 (switch)

015 _ 자바스크립트 조건문 사용하기 (switch)

[적용]

• 조건을 만족하는 다수의 데이터를 처리하고 싶을 때

---

[내용]

switch문은 조건을 만족하는 데이터를 처리하는 작업을 실시한다.

---

[문법]

구문	의미
switch (식)	식에 따라 처리를 분기
case 값: 처리 내용	해당 조건 만족 시 처리
default: 처리 내용	만족하는 조건이 하나도 없는 경우의 처리

---

[예시1]

switch문의 () 안 값과 case의 값이 일치할 경우에만 해당 case의 처리가 실행된다.

case의 값 뒤에는 '콜론(;)'을 붙인다.

상수 myFruit의 값에 따라 알림창을 띄우는 샘플 코드를 확인해 보자.

 

JavaScript

const myFruit = '사과';

switch (myFruit) {
    case '사과':
        alert('사과입니다.');
        break;
    case '귤':
        alert('귤입니다.');
        break;
    default:
        alert('기타 과일입니다.');
        break;
}

---

[예시2]

break는 처리를 종료하는 명령문으로, 생략하면 switch문이 끝나지 않고

다음 case문의 조건 일치 여부를 계속해서 확인한다.

 

JavaScript

const myFruit = '사과';

switch (myFruit) {
    case '사과':
        alert('사과입니다.');
    case '귤':
        alert('귤입니다.');
    default:
        alert('기타 과일입니다.');
}

---

[예시3]

예시2의 특성을 활용하면 여러 case의 결과 처리를 한 곳에서 실행 가능하다는 이점이 있다.

 

JavaScript

const myFruit = '사과';

switch (myFruit) {
    case '사과':
    case '귤':
        alert('사과 혹은 귤입니다.');
        break;
    default:
        alert('기타 과일입니다.');
}

case 에서 break 혹은 default에서 break까지의 단위를 하나의 구로 표현하며,

이를 case구, default구라고 한다.

break문을 의도치 않게 생략하여 처리 중복으로 인한 에러가 발생하지 않도록 주의하자.

---

[예시4]

default는 어느 case도 실행되지 않았을 떄 실행되는 영역으로 생략이 가능하다.

 

JavaScript

const myFruit = '사과';

switch (myFruit) {
    case '사과':
    case '귤':
        alert('사과 혹은 귤입니다.');
        break;
    // default는 생략
}

---

[Appendix]

switch는 === 비교를 한다.

switch 식은 값과 타입의 비교가 모두 이루어진다(===비교).

다음의 샘플을 통해 첫 번째가 아닌 두 번째 구가 실행되는 것을 확인해 보자.

 

JavaScript

// 문자 타입의 '100'
const myValue = '100'

switch (myValue) {
    case 100:
        // 숫자 타입일 경우 실행
        console.log('숫자 타입의 100입니다.');
        break;
    default:
        console.log('숫자 타입의 100이 아닙니다.');
        break;
}

---

 

 

 

 

참조 :
실무에 바로 적용하는 자바스크립트 코드레시피 278
아케다 야스노부, 카노 타케시 지음 / 이춘혁 옮김