JavaScript의 Switch문 사용법에 대한 자세한 설명-JS 튜토리얼-php.cn

JavaScript의 Switch문 사용법에 대한 자세한 설명

青灯夜游

풀어 주다： 2019-11-26 17:32:10

앞으로

3990명이 탐색했습니다.

if...else 외에도 JavaScript에는 스위치 문이라는 기능이 있습니다. 스위치는 가능한 여러 상황에 대해 표현식을 평가하고 일치하는 상황에 따라 하나 이상의 코드 블록을 실행하는 조건문입니다. 스위치 문은 다른 많은 if 블록을 포함하는 조건문과 밀접하게 관련되어 있으며 종종 같은 의미로 사용됩니다.

JavaScript의 Switch문 사용법에 대한 자세한 설명

이 튜토리얼에서는 switch 문 사용법과 관련 키워드인 case, break, default 사용법을 배워보겠습니다. 마지막으로 스위치 문에서 여러 사례를 사용하는 방법을 다룹니다.

【관련 강좌 추천: JavaScript 동영상 튜토리얼】

Switch

switch 문은 표현식을 평가하고 대소문자가 일치하는 결과로 코드를 실행합니다. 처음에는 약간 겁이 날 수도 있지만 기본 구문은 if 문과 유사합니다. 이는 항상 테스트할 표현식이 포함된 괄호와 실행할 기본 코드가 포함된 중괄호와 함께 switch(){}를 사용하여 작성됩니다.

아래는 두 개의 Case 문과 default라는 대체 문이 있는 스위치 문의 예입니다.

switch (expression) {
    case x:        
    // execute case x code block
        break;    
     case y:
     // execute case y code block
        break;   
      default:        
      // execute default code block
      }

로그인 후 복사

위 코드 블록의 논리에 따르면 다음은 발생할 이벤트의 순서입니다.

표현식이 평가됩니다

첫 번째 경우 x는 표현식에 대해 테스트됩니다. 일치하는 항목이 있으면 코드가 실행되고 break 키워드가 스위치 블록을 종료합니다.

일치하지 않으면 x를 건너뛰고 y는 대소문자 표현을 기준으로 테스트됩니다. y가 표현식과 일치하면 코드가 실행되고 스위치 블록이 종료됩니다.

모든 경우가 일치하지 않으면 기본 코드 블록이 실행됩니다.

위 구문에 따라 switch 문의 작동 예제를 만들어 보겠습니다. 이 코드 블록에서는 새로운 Date() 메서드를 사용하여 현재 요일을 찾고 getDay()를 사용하여 현재 날짜에 해당하는 숫자를 인쇄합니다. 1은 월요일을 나타내고 7은 일요일을 나타냅니다. 변수를 설정하는 것부터 시작하겠습니다.

const day = new Date().getDay();

로그인 후 복사

스위치를 사용하여 매주 매일 콘솔에 메시지를 보냅니다. 프로그램은 위에서 아래로 순서대로 실행되어 일치 항목을 찾고 일단 발견되면 break 명령은 스위치 블록을 중지하고 명령문 평가를 계속합니다.

week.js

// Set the current day of the week to a variable, with 1 being Monday and 7 being Sunday
const day = new Date().getDay();
switch (day) {
    case 1:
        console.log("Happy Monday!");        
        break;    
    case 2:
        console.log("It&#39;s Tuesday. You got this!");        
        break;    
    case 3:
        console.log("Hump day already!");        
        break;    
    case 4:
        console.log("Just one more day &#39;til the weekend!");        
        break;    
     case 5:
        console.log("Happy Friday!");        
        break;    
      case 6:
        console.log("Have a wonderful Saturday!");        
        break;    
      case 7:
        console.log("It&#39;s Sunday, time to relax!");        
        break;    
      default:
        console.log("Something went horribly wrong...");
}

로그인 후 복사

Output
&#39;Just one more day &#39;til the weekend!&#39;

로그인 후 복사

이 코드는 목요일에 테스트되었으며 4에 해당하므로 콘솔 출력은 Just one more day 'til the Weekend!입니다. 코드를 테스트하는 요일에 따라 결과가 달라집니다. 기본적으로 오류가 발생할 경우 실행할 블록을 마지막에 포함합니다. 일주일은 7일뿐이므로 이 경우에는 오류가 발생해서는 안 됩니다. 예를 들어 월요일부터 금요일까지의 인쇄 결과만 있을 수도 있고 기본 블록에는 주말에도 동일한 정보가 있을 수 있습니다.

각 명령문에서 break 키워드를 생략하면 다른 Case 명령문은 모두 true로 평가되지 않지만 프로그램은 끝까지 도달할 때까지 계속 확인합니다. 프로그램을 더 빠르고 효율적으로 만들기 위해 휴식 시간을 포함합니다.

스위치 범위

위의 예처럼 단일 값이 아닌 스위치 블록의 값 범위를 평가해야 하는 상황이 있습니다. 표현식을 true로 설정하고 각 사례 문에서 작업을 수행하면 이를 수행할 수 있습니다.

이를 더 쉽게 이해할 수 있도록 다음 요구 사항에 따라 숫자 점수를 문자 등급으로 변환하는 간단한 채점 앱을 만들었습니다.

　● 90레벨 이상은 A

● 80~89레벨은 B

● 70~79레벨은 C

● 60~69레벨은 D

● 59레벨 이하는 F

이제 가능해요 스위치 문으로 작성하세요. 범위를 확인하고 있으므로 각 경우에 대해 각 표현식이 true로 평가되는지 확인하기 위해 작업을 수행한 다음 true 요구 사항이 충족되면 명령문을 분리합니다.

grades.js

// Set the student&#39;s grade
const grade = 87;
switch (true) {
    // If score is 90 or greater
    case grade >= 90:
        console.log("A");       
        break;    
     // If score is 80 or greater
    case grade >= 80:
        console.log("B");        
        break;    
     // If score is 70 or greater
    case grade >= 70:
        console.log("C");       
        break;    
      // If score is 60 or greater
    case grade >= 60:
        console.log("D");        
        break;    
      // Anything 59 or below is failing
    default:
        console.log("F");
}

로그인 후 복사

Output
&#39;B&#39;

로그인 후 복사

이 예에서 괄호 안의 표현식은 true로 평가됩니다. 이는 true로 평가되는 모든 항목이 일치함을 의미합니다.

else를 사용하는 것과 마찬가지로 스위치는 위에서 아래로 평가하고 첫 번째 실제 일치를 허용합니다. 따라서 순위 변수가 87이고 따라서 C와 D에 대해 true로 평가되더라도 첫 번째 일치 항목은 B이고 출력이 됩니다.

여러 사례

여러 사례가 동일한 출력을 가져야 하는 코드를 접할 수 있습니다. 이를 달성하기 위해 각 코드 블록에 대해 여러 사례를 사용할 수 있습니다.

이를 테스트하기 위해 이번 달과 적절한 계절을 일치시키는 작은 앱을 만들어 보겠습니다. 먼저 new Date() 메소드를 사용하여 현재 달에 해당하는 숫자를 찾아 이를 월 변수에 적용하겠습니다.

단순화를 위해 애플리케이션은 다음 사양으로 사계절을 출력합니다.

● 겨울: 1월, 2월, 3월

● 봄: 4월, 5월, 6월

● 여름: 7월, 8월, 9월

● 가을: 10월, 11월, 12월

以下是我们的代码。

seasons.js

// Get number corresponding to the current month, with 0 being January and 11 being December
const month = new Date().getMonth();
switch (month) {
    // January, February, March
    case 0:    
    case 1:    
    case 2:
        console.log("Winter");        
        break;    
    // April, May, June
    case 3:    
    case 4:    
    case 5:
        console.log("Spring");        
        break;    
    // July, August, September
    case 6:    
    case 7:    
    case 8:
        console.log("Summer");        
        break;    
    // October, November, December
    case 9:    
    case 10:    
    case 11:
        console.log("Autumn");        
        break;    
    default:
        console.log("Something went wrong.");
   }

로그인 후 복사

当我们运行代码时，我们将根据上面的规范接收识别当前季节的输出。