📌Language/JavaScript

자바스크립트, if문과 switch 구문 비교하기

hellohailie 2022. 7. 20. 16:22

 

day 1 ~ 7에 맞게 Monday ~ Friday로 나오는 if문은 아래와 같다. 

 

const day =3;

if(day === 1) {
  console.log('Monday')
} else if(day == 2) {
  console.log('Tuesday')
}else if(day == 3) {
  console.log('Wednesday')
}
else if(day == 4) {
  console.log('Thursday')
}
else if(day == 5) {
  console.log('Friday')
}

// 결과값
'Wednesday'

 

 

👇 위의 예시를 switch로 바꾸어보자!

 

const day = 3;
switch(day) {
     case 1:
    console.log('Monday');
     case 2:
    console.log('Tuesday');
     case 3:
    console.log('Wednesday');
     case 4:
    console.log('Thursday');
     case 5:
    console.log('Friday');
}

//결과값
'Wednesday'

'Thursday'

'Friday'

 

switch는 기본적으로 일치하는 항목을 찾는 일을 한다. 

일치하는 항목을 찾으면 스위치가 거기서부터 코드를 실행한다. 다만, 중단 지점까지 계속 실행한다. (break; 필요)
switch를 사용하면 각각의 케이스에 break를 넣어주어야 한다. 

 


 

👇 위의 예시에 break를 추가해보자!

 

switch(day) {
     case 1:
    console.log('Monday');
    break;
     case 2:
    console.log('Tuesday');
    break;
     case 3:
    console.log('Wednesday');
    break;
     case 4:
    console.log('Thursday');
    break;
     case 5:
    console.log('Friday');
    break;
    case 6:
    case 7:
    console.log('Weekend');
    break;
  default:
    console.log('I dont know that');
}

// 결과값
'Wednesday'

 

break라는 중단 지점을 넣어줘서 원하는 값만 받을 수 있다. 

 

혹시 기타 값이 입력돼서 아무것도 일치하지 않으면 default를 설정하면 된다. 

그리고 일치하는 항목을 찾으면 스위치가 거기서부터 중단 지점까지 계속 코드를 실행하는 switch 문을 활용해서 day가 6,7인 경우 동일한 결과값을 원한다면 위와 같이 써준면 된다. 

 

switch 구문의 장점 = 수 많은 케이스를 한꺼번에 확인 & 대조할 수 있다. 

하지만 위의 예시는 그렇게 딱 알맞는 switch 구문의 예시는 아니다. 

 

대부분은 if, else if 를 씁니다. 

 

😃 잘못된 개념 전달이 있다면 댓글 부탁드립니다. 저의 성장에 큰 도움이 됩니다🤓