[JS] switch와 case 이해하기

switch와 case 이해하기

• switch와 case란?
• 순서도(플로우 차트)
• 예시

---

switch와 case란?

switch는 확인할 변수를 () 안에 넣고 변수가 어떠한 값을 가진 지 확인하고 그에 따라 실행할 내용을 선택하는 말 그대로 스위치 하는 기능이다. 

case는 switch의 () 안에 있는 변수의 값이 case의 값이 라면 case의 내용을 실행한다. 실행할 내용은 {} 안에 적을 필요 없고 실행할 내용이 여러 가지라면 ;을 이용하여 구분하여준다.

switch(변수){
    case 1 :
    	내용1;
    	break;
    case "가" :
    	내용2;
    	break;
    case 'a' :
    	내용3;
        내용4;
    	break;
    default:
    	내용5;
}

1. 변수 값을 확인한다.

2. case에 따른 값이 맞는지 비교한다.

3-1. 변수의 값이 1이라면 내용 1을 실행 후 break를 만나 switch문을 끝낸다.

3-2. 변수의 값이 "가"라면 내용 2를 실행 후 break를 만나 switch문을 끝낸다.

3-3. 변수의 값이 'a'라면 내용 3과 내용 4를 실행 후 break를 만나 switch문을 끝낸다.

3-4. 변수의 값이 case 중에 없으면 내용 5를 실행한다.

---

순서도 (플로우 차트)

switch case 순서도 (플로우 차트)

---

예시

let 변수=='a'
switch(변수){
    case 1 :
    	console.log("내용1 : 변수의 값이 1이라면 이게 찍혀요.");
    	break;
    case "안녕" :
    	console.log("내용2 : 변수의 값이 안녕이라면 이게 찍혀요.");
        break;
    case 'a' :
    	console.log("내용3 : 변수의 값이 a이라면 이게 찍혀요.");
        break;
    case "한글" :
    	console.log("내용4 : 변수의 값이 한글이라면 이게 찍혀요.");
        console.log("내용5 : break가 없으니 case 'b' 의 내용도 찍혀요.")
    case 'b' :
    	console.log("내용6 : 변수의 값이 1이라면 이게 찍혀요.");
        break;
    case "안녕하세요" :
    	console.log("내용7 : 변수의 값이 안녕하세요라면 이게 찍혀요.");
        break;
    default:
    	console.log(내용8 : "위의 case 값이 변수와 같은 것이 없으면 이게 찍혀요");
    
}

변수에 값을 'a'라고 정합니다.

변수의 값 'a'가 어떠한 케이스와 맞는지 확인합니다.

첫 번째 case의 값은 1이므로  변수의 값과 달라 내용 1을 실행하지 않습니다.

두 번째 case의 값은 "안녕"이므로  변수의 값과 달라 내용 2를 실행하지 않습니다.

세 번째 case의 값은 'a'이므로 변수의 값과 같아 내용 3을 실행하고 break를 만나기 때문에 switch문을 종료합니다.

 

결과 : 내용 3 : 변수의 값이 a이라면 이게 찍혀요.

 

*만약 변수의 값이 "한글"이었다면 네 번째 case의 내용인 내용 4와 내용 5를 실행하고 break가 없으므로 다섯 번째 case의 내용까지 넘어가서 실행합니다. 그러고 다섯 번째 case의 break를 만나 switch문을 종료합니다.

 

결과 : 

내용 4 : 변수의 값이 한글이라면 이게 찍혀요.

내용 5 : break가 없으니 case 'b'의 내용도 찍혀요.

내용 6 : 변수의 값이 1이라면 이게 찍혀요.

 

if, else if, else 이해하러 가기