udy JavaScript 0418 - 1hr switch 문

10806 단어 JavaScriptJavaScript

switch 문

1. 일반적인 switch문

복수의 if문은 switch문으로 대체할 수 있다.
switch문은 하나 이상의 case문으로 구성되며 default는 필수가 아니다.

 switch(x) {
         case 'value1':  // if (x === 'value1')
           ...
           [break]

         case 'value2':  // if (x === 'value2')
           ...
           [break]

         default:
           ...
          [break]
       }

코드의 진행 과정

  1. 변수 x의 값과 첫 번째 case의 value1를 일치 비교 후, 두 번째 case의 value2와 비교한다. case의 개수에 따라 이런 과정이 계속 반복이 된다.
  2. case문에서 변수 x의 값과 일치하는 value를 찾으면 case문의 아래 코드가 실행되며 이때, break문을 만나거나 switch문이 끝나면 코드의 실행이 멈춘다.
  3. x의 값과 일치하는 case문이 없다면 default문이 있는 경우, default문 아래의 코드가 실행된다.
	  let a = 2 + 2;

      switch (a) {
        case 3:
          alert( '비교하려는 값보다 작다. 다음 case문으로 이동' );
          break;
        case 4:
          alert( '비교하려는 값과 일치한다. 멈춘다.' );
          break;
        case 5:
          alert( '비교하려는 값보다 크다.' );
          break;
        default:
          alert( "조건에 맞는 값이 없다." );
      }

만약 위의 코드에서 break가 없다면 어떻게 될까?

		let a = 2 + 2;

        switch (a) {
          case 3:
            alert( '비교하려는 값보다 작습니다.' );
          case 4:
            alert( '비교하려는 값과 일치합니다.' );
          case 5:
            alert( '비교하려는 값보다 큽니다.' );
          default:
            alert( "어떤 값인지 파악이 되지 않습니다." );
        }

위의 코드에서 break만 뺀 코드이다.
이렇게 도면 case 4 부터 그 이후에 있는 모든 alert가 실행된다.

2. 여러개의 case문 묶기

	  let a = 3;

      switch (a) {
        case 4:
          alert('계산이 맞습니다!');
          break;

        case 3: // 두 case문 묶기
        case 5:
          alert('계산이 틀립니다!');
          alert("다시 계산해 보세요!");
          break;

        default:
          alert('계산 결과가 이상하네요.');
      }

case3과 5는 동일한 메세지를 보여주며,case 3이 참인 경우 break도 없고 case 5가 있기에 break를 만날 때 까지 코드가 계속 실행된다.

3. 자료형의 중요성

switch문은 일치 비교로 조건을 확인한다.
비교하려는 값과 case문의 값의 형과 값이 같아야 해당 case문이 실행된다.

  	  let arg = +prompt("값을 입력해주세요.");
      switch (arg) {
          case '0':
          case '1':
            alert( '0이나 1을 입력하셨습니다.' );
            break;

          case '2':
            alert( '2를 입력하셨습니다.' );
            break;

          case 3:
            alert( '+prompt로 하지 않으면 이 코드는 실행되지 않는다!' );
            break;
          default:
            alert( '알 수 없는 값을 입력하셨습니다.' );
        }
  1. 0 or 1 입력 시 첫 번째 alert문이 실행된다.

  2. 2를 입력한 경우 두 번째 alert문이 실행된다.

  3. 3을 입력하더라도 세 번째 alert문이 실행되지 않는다.
    이는 prompt함수는 문자열을 반환하기 때문에 문자열 '3'과 숫자형 3은 형 자체가 달라 default문이 실행된다.

★ case 3의 alert문을 실행 시키려면 prompt를 +prompt로 바꿔주면 나오지만
case 0, 1의 alert문은 실행시킬 수 없다.

좋은 웹페이지 즐겨찾기