[Javascript] switch 조건문

sujin·2022년 3월 22일

JavaScript TIL

자바스크립트

목록 보기

5/11

switch 조건문

if문과 삼항 연산자와 같이 switch문은 조건에 따라 다른 동작을 수행시킬 수 있다.
switch문은 어떤 값을 가진 대상을 두고 조건값과 일치하는지를 확인하고 동작을 수행하는 방식이다.

문법

let 변수;

switch (변수){
  case 상수1 :  // 변수 = 상수1이면, 실행문 A실행
    실행문 A; 
    break; // swith{} 코드 블록 탈출
    
  case 상수2 : // 변수 != 상수1 이고, 변수 = 상수2 이면, 실행문 B 실행
    실행문 B;
    break; // swith{} 코드 블록 탈출
    
  default: // 변수 != 상수1 이고, 변수 != 상수2 이면, 실행문 C 실행
    실행문 C;
}

switch조건문은 switch문과 case문으로 구성된다.
switch의 변수와 case의 상수를 비교하여 일치하면 실행, 일치하지 않으면 다음 case문으로 넘어간다.
switch() 괄호안에는 변수, 상수, 비교연산자 등 데이터가 자유롭게 올 수 있지만, case 문 뒤에는 상수 값만 올 수 있다.

break문의 역할과 이유

break는 switch의 중괄호를 빠져나가는 명령어다.
witch조건문은 break문을 만나기 전까지 조건값들을 비교하여 case문 혹은 default문을 실행한다. 그렇다면, 만약 break문이 없이 switch 조건문을 작성한다면 어떻게 될까

let a = 2;

//=============== break 사용하지 않았을 때 ===================
switch(a) {
  case 1 : 
        console.log('a는 1입니다.');
   case 2:
        console.log('a는 2입니다.'); 
    default:
        console.log('a는 1도 2도 아닙니다.'); 
}

// 결과
// a는 2입니다.
// a는 1도 2도 아닙니다.

//=============== break 사용했을 때 ===================
switch(a) {
  case 1 : 
        console.log('a는 1입니다.');
        break;
   case 2:
        console.log('a는 2입니다.'); 
        break;
    default:
        console.log('a는 1도 2도 아닙니다.'); 
}

// 결과
// a는 2입니다.

break를 사용하지 않았을 때, 'a는 2입니다.'와 'a는 1도 2도 아닙니다.'가 모두 출력이 된다.
switch문의 조건과 일치하는 두 번째 case 문의 동작 부분을 수행한 다음, break문이 없기 때문에 그다음 동작도 수행해 버린 것이다.
case문은 switch문 내부의 여러 동작들 중에서 가장 먼저 동작할 시작점을 찾는 기준이라고 할 수 있다.
case별로 동작들을 구분하고 싶다면 필요한 구간에 break문을 작성해줘야 한다.

switch문 장점 : 간결성, 가독성

switch 조건문은 if else if 조건식으로 변환할 수 있다.
두 식을 비교해보면 switch 조건문이 조금더 간결하고 가독성이 높다.

switch문

let drink = prompt ( "가격 조회를 원하는 음료수를 입력하세요.( 콜라, 사이다, 커피 中 택1)", "" );

switch (drink){
    case "콜라" :
      document.write ( "800원" );
      break;

    case "사이다" :
      document.write ( "900원");
      break;

    case "커피" :
      document.write ( "700원" );
      break;

    default :
      document.write ("잘못된 단어 입력");
}

if else if문

let drink = prompt ( "가격 조회를 원하는 음료수를 입력하세요.( 콜라, 사이다, 커피 中 택1)", "" );

if ( drink = "콜라" ){
    document.write ( "800원" );
}else if (drink = "사이다"){
    document.write ( "900원" );
}else if (drink = "커피"){
    document.write ( "700원" );
}else{
    document.write ( "잘못된 단어 입력" );
}

switch문 단점 : 상수

switch()의 괄호 사이에는 자유롭게 데이터가 올 수 있지만, case뒤에는 상수만 올 수 있다.
case뒤에 변수, 조건식 등이 오게 되면 switch 조건문이 작동하지 않는다.
비교 대상에 변수나 조건식을 비교해야 할 경우 switch문 대신 if else if 조건문을 사용해야 한다.

switch문

let num = prompt( "원하는 숫자를 입력하세요.", "" );
switch ( num ){
     case num > 0 :  
      document.write ( "입력한 숫자는 양수입니다." );
      break;

    case num = 0 :   
      document.write ( "입력한 숫자는 0입니다." );
      break;

    case num < 0 :  
      document.write ( "입력한 숫자는 음수입니다." );
      break;

    default
      document.write ( "숫자를 입력해주세요." );
}

if else if 조건문

let num = prompt( "원하는 숫자를 입력하세요.", "" );=
if ( num > 0 ){
     document.write ( "입력한 숫자는 양수입니다." );
}else if ( num = 0 ){
     document.write ( "입력한 숫자는 0입니다." );
}else if ( num < 0){
     document.write ( "입력한 숫자는 음수입니다." );
}else{
     document.write ( "숫자를 입력해주세요." );
}