JavaScript

#8 자바스크립트(JavaScript) - 조건문 : switch - case

에이블디 2022. 3. 16. 21:01

안녕하세요 여러분! 에이블디 입니다!

 

이번 시간에는 조건문 중의 하나인 switch - case문에 대해 알아보도록 해요!

 

프로그램을 만들다 보면 여러 가지 조건을 줘야 하는 상황이 생기는데요, 이럴 때 지난 시간에 배웠던 if - else문을 여러 번 중첩해서 사용할 수도 있지만, 이렇게 하면 if - else문이 계속 중첩되기 때문에 코드가 길고 지저분해지고, 나중에 오류를 찾기도 힘들어집니다.

 

그래서 조건이 3개 이상이 되면 if - else문보다는 switch - case문을 사용하는 것이 더 편리한데요, 지금부터 switch - case문에 대해 알아보도록 하겠습니다.

 

지금부터 number라는 변수의 숫자 값이 변할 때마다 결과가 달라지는 switch - case문을 짜 볼 텐데요! 사용법은 간단합니다!

 

1. switch문 오른쪽에 소괄호 안에 값을 확인할 변수를 지정합니다.

 

2. 조건 값은 case문 다음에 콜론(:)을 붙여 지정하고, 해당 조건을 충족할 때 실행할 코드를 콜론 다음에 작성해 줍니다. 그리고 break문을 사용하여 코드를 실행한 다음에는 switch문을 빠져나오도록 코드를 작성해줍니다.

 

3. default에는 사용자가 입력한 값이 case문에서 지정한 조건 값과 전부 일치하지 않을 때 실행할 코드를 작성해 줍니다. default에서는 break를 사용하지 않습니다.

 

그럼 코드로 한번 확인해 볼까요?

 

일단 switch - case 문을 작성하기 전에 if - else 문으로 작성해 보겠습니다.

var number = 4;

if(number == 1) {
	console.log("number가 1일 때 실행되는 코드입니다.");
}else if(number == 2) {
	console.log("number가 2일 때 실행되는 코드입니다.");
}else if(number == 3) {
	console.log("number가 3일 때 실행되는 코드입니다.");
}else if(number == 4) {
	console.log("number가 4일 때 실행되는 코드입니다.");
}else {
	console.log("number가 if문의 조건을 모두 충족하지 않을 때 실행되는 코드입니다.");
}

코드를 실행하여 결과를 볼까요?

 

다음엔 switch - case 문으로 작성해 보겠습니다.

var number = 4;

switch(number){
    case 1 : console.log("number가 1일 때 실행되는 코드입니다.");
    break;
    case 2 : console.log("number가 2일 때 실행되는 코드입니다.");
    break;
    case 3 : console.log("number가 3일 때 실행되는 코드입니다.");
    break;
    case 4 : console.log("number가 4일 때 실행되는 코드입니다.");
    break;
    default : console.log("case문에서 지정한 조건 값과 전부 일치하지 않을 때 실행되는 코드입니다.");
}

if - else문보다 뭔가 더 깔끔하고 간결해진 느낌이죠?

 

코드를 한번 실행해 볼까요?

if - else 문과 동일한 결괏값을 보여주는 걸 확인할 수 있습니다.

 

이번 시간에는 switch - case문에 대해 알아보았습니다!

 

그럼 여러분 다음 시간에 또 만나요!