switch

switch 조건문

• 복수의 if 조건문은 switch문으로 바꿀 수 있으며 switch문은 다양한 상황에서 비교할 수 있게 해준다.
• switch조건문은 switch문과 case문으로 구성되며 switch의 변수와 case의 상수를 비교하여 일치하면 실행, 일치하지 않으면 다음 case문으로 넘어간다.
• switch() 괄호 안에는 변수, 상수, 비교 연산자 등 자유롭게 설정 할 수 있지만, case 문 뒤에는 상수 값만 올 수 있다.

문법

switch (expression) {
  case caseExpression1:
    statements
  case caseExpression2:
    statements
  // …
  case caseExpressionN:
    statements
  default:
    statements
}

 

 

break

자바스크립트가 break 키워드를 만나면, 해당 스위치 블록을 빠져나와 코드 실행이 중지된다.

만약 break문을 생략하면 다음의 케이스 문의 결과가 일치 하지 않아도 해당 구문이 실행되어 주의 해야 한다.

마지막 케이스는 자동으로 break 처리 되어 따로 break 키워드를 입력할 필요가 없다.

default

일치하는 케이스 문이 없을 때 실행 할 코드를 지정해줍니다.

블록 안에서 꼭 마지막에 위치 시킬 필요는 없지만 마지막 위치가 아니면 break문을 주어야 한다.

다른 case 지만 공통 코드 주고 싶을 때

let a = 2;
switch (a) {
  case 1:
  case 2:
     console.log('a는 1');
    break;
  case 4:
  case 6:
    console.log('a는 2'); 
    break;
  default:
  console.log('a는 1도 2도 아니다.'); 
}

 

 

블로그에서 사용한 switch문

blockContent type 에 일치하면 해당 코드가 보이고 일치하는 타입이 없으면 해당 블록은 무시하게 했다. 해당 코드에서는 return 문을 사용하여 switch 문을 탈출하고 있어 별도로 break 문을 사용 하지 않았다.

switch (blockContent.type) {
    case "paragraph":
      return (
        <>
          // ... 해당코드
        </>
      );
    case "bulleted_list_item":
      return (
        <>
          // ... 해당코드
        </>
      );
    
    // .....

    case "embed":
      return (
        <>
          // ... 해당코드
        </>
      );
    default:
      return null; // 다른 블록 유형은 무시
  }

 

 

참고

switch - JavaScript | MDN