티스토리 뷰

어떤 값을 입력했는지에 따라 다르게 동작하는 문법인 switch문에 대해 알아봅시다.

if문과 비슷하지만 동작하는 방식이 조금은 다른데 switch문의 기본 구조는 이렇게 생겼습니다.

// switch문(switch statement)
switch (비교할 값){
 case 조건값_1:
 	동작부분;
    break;
 case 조건값_2:
 	동작부분;
    break;
 default:
 	동작부분;
}

먼저 switch라는 키워드를 작성한 다음 소괄호를 열어 비교할 값을 작성해주고 그리고 중괄호를 열어줍니다. 그리고 case라는 키워드 다음에 조건값을 쓰고 콜론(:)을 입력해 줍니다. 그리고 비교할 값과 조건값이 서로 일치할 때 동작할 코드를 작성한 다음에 break라는 키워드를 입력해줍니다. break의 역할은 switch문을 빠져나오는 것입니다. 조건값에 대한 동작을 마쳤기 때문에 switch문을 빠져나오라는 뜻입니다. 이렇게 하면 switch문에서 한 가지 조건을 완성하는 것입니다. 이런 식으로 조건이 더 필요한 경우에는 똑같이 case와 조건과 동작 코드를 입력하고 break를 작성해 주면 됩니다.

 

default 다음에 콜론(:)이 있는 것은 비교할 값이 모든 조건값과도 일치하지 않을 경우에 동작할 코드를 작성하면 됩니다.

비교할 값이 조건값 1과도 일치하지 않고 조건값 2와도 일치하지 않을 경우에 동작할 코드를 작성하는 것입니다. 조건을 만족하지 않을 경우에 작성하는 else문과 비슷한 역할입니다. 마찬가지로 defualt문도 필요에 따라서는 생략이 가능합니다.

// switch문(switch statement)
/**
* 당신은 등산을 하던 중 갑작스레 산불이 발생해 대피 중입니다.
* 그러던 중 산중턱에서 다친 동물 4마리를 만났습니다.
* 이미 체력이 많이 떨어진 당신,
* 이 동물 중 단 한 마리만 구출할 수 있습니다.
* 과연 당신의 선택은?
* 1. 토끼 2. 고양이 3. 코알라 4. 강아지
*/

let myChoice = 2;

switch(myChoice){
	case 1:
    	condole.log('토끼를 선택한 당신, ...');
   		break;
    case 2:
    	condole.log('고양이를 선택한 당신, ...');
    	break;
    case 3:
    	condole.log('코알라를 선택한 당신, ...');
    	break;
    case 4:
    	condole.log('강아지를 선택한 당신, ...');
    	break;
    default:
    	condole.log('1에서 4사이의 숫자를 선택해 주세요.');
}

선택지를 담아둘 변수를 하나 만들고 숫자를 할당해줍니다. 그리고 변수를 switch문의 비교할 값에 넣어줍니다.

보기가 네 개이기 때문에 case를 네 개 만들어줍니다. 거기에 맞는 동작 부분과 break도 같이 작성해줍니다. 실수로 1부터 4가 아니라 다른 값을 입력할 경우를 대비해서 default문도 작성해줍니다.

저장하고 실행해보면 '고양이를 선택한 당신, ...'이 나오는 것을 확인할 수 있습니다.

 

그런데 break문을 모두 지우면 고양이... 코알라... 강아지... 1에서 4까지... case2에서부터 default까지 모든 동작 부분이 실행됩니다. switch문은 조건과 일치하는 경우를 찾은 다음에는 break문을 만나기 전까지 그 아래 모든 동작을 실행하게 됩니다. 그렇기 때문에 각각의 case 별로 동적 부분을 작성한 다음 break를 작성해야 좀 더 안전하게 switch문을 사용할 수가 있습니다.

 

물론 이런 특징을 활용해서 의도적으로 break문을 생략하면서 switch문을 운영할 수도 있습니다.

'프론트엔드 > JavaScript' 카테고리의 다른 글

[제어문] 09. for문  (0) 2022.09.27
[제어문] 07.switch문 vs if문  (0) 2022.09.26
[객체] 07. 객체와 메소드  (0) 2022.09.24
[객체] 05. 객체 다루기  (0) 2022.09.24
[제어문] 03. else if문  (0) 2022.09.24
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
«   2024/12   »
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31
글 보관함