JavaScript - switch 조건문

Javascriptexamples

Javascript의 Switch 조건문에 대해서 소개합니다. switch로 구현할 수 있는 것은 모두 if문으로 구현할 수 있지만 가독성을 위해 switch를 사용할 수 있습니다.

1. switch 문법

switch의 문법은 Java 등의 다른 언어와 Syntax가 비슷합니다.

아래와 같이 switch에 전달된 expression과 case의 value가 일치하면 해당 case의 코드들이 수행됩니다. 일치하는 것이 없다면 default의 코드가 수행됩니다. 만약 break가 없다면 그 아래의 case도 모두 수행됩니다.

const expression = value1;

switch (expression) {
  case value1:
    // do something
    break;
  case value2:
    // do something
    break;
  ...
  case valueN:
    // do something
    break;
  default:
    // do something
    break;
}

2. switch 예제

다음은 switch를 사용하는 예제입니다.

아래 예제에서

  • Orange를 switch에 전달하면 case 'Orange'가 실행되며 break가 호출되어 switch 구문을 종료합니다.
  • Apple을 switch에 전달하면 case 'Apple'이 수행되며, break가 없기 때문에 case 'Mango'의 구문까지 수행하고 break를 만나 switch를 종료합니다.
  • Banana를 switch에 전달하면 일치하는 case가 없기 때문에 default 구문이 수행됩니다.
function buySomething(expr) {
  switch (expr) {
    case 'Orange':
      console.log('You can buy orange');
      break;
    case 'Apple':
    case 'Mango':
      console.log('You can buy apple or mango');
      break;
    default:
      console.log(`Sorry, we are out of ${expr}.`);
  }
}

buySomething("Orange");
buySomething("Apple");
buySomething("Mango");
buySomething("Banana");

Output:

You can buy orange
You can buy apple or mango
You can buy apple or mango
Sorry, we are out of Banana.

3. Number를 사용하는 switch 예제

String 뿐만 아니라 다음과 같이 Number 타입의 객체도 switch에서 사용할 수 있습니다.

function doSomething(expr) {
  switch (expr) {
    case -1:
      console.log(-1);
      break;
    case 0:
      console.log(0);
      break;
    case 1:
      console.log(1);
      break;
    default:
      console.log("default");
  }
}

doSomething(-1);
doSomething(-0);
doSomething(1);
doSomething(-2);

Output:

-1
0
1
default

4. switch 안에서 변수 선언 및 사용

switch 구문 안에서 변수를 선언하고 사용할 수 있습니다.

하지만 아래와 같이 동일한 이름의 변수를 case 마다 선언하면 동일한 변수가 선언되었다고 컴파일 에러가 발생합니다.

let expr = "hi";

switch (expr) {
  case "hi":
    let msg = "hi!";
    console.log(msg);
    break;
  case "hello":
    let msg = "hello!";
    console.log(msg);
    break;
}

Output:

let msg = "hello!";
    ^
SyntaxError: Identifier 'msg' has already been declared
at wrapSafe (internal/modules/cjs/loader.js:1001:16)

이럴 때는, 다음과 같이 { }로 case 구문을 감싸서 scope를 분리하면 동일한 이름의 변수를 case 마다 사용할 수 있습니다.

let expr = "hi";

switch (expr) {
  case "hi": {
    let msg = "hi!";
    console.log(msg);
    break;
  }
  case "hello": {
    let msg = "hello!";
    console.log(msg);
    break;
  }
}

Output:

hi!
Loading script...

Related Posts

codechachaCopyright ©2019 codechacha