`switch`文 の

`switch`文について

基本的な構文

if文のほかに、JavaScriptには条件に応じて処理を実行するswitch文もあります。 これは、1つの変数を複数の値と比較する必要があるときに使います。 比較は厳密等価（===）かどうかで行われます。詳しくは比較のコンセプトを参照してください。 ある変数xに対して、JavaScriptのswitch文は次のような構文になります。

switch (x) {
  case option1:
    // code that is executed when "x === option1" is true
    break;
  case option2:
    // code that is executed when "x === option2" is true
    break;
  default:
    // code that is executed when x does not equal any of the
    // options
}

defaultケースは省略可能で、どの値も変数と一致しなかったときに何らかのコードを実行したい場合に使います。

デフォルトでのフォールスルー

上のbreak文が必要なのは、JavaScriptではデフォルトですべてのケースが「フォールスルー」するためです。 つまり、break文が1つもなければ、最初に一致した値より下にあるケースのコードが、xがそれらの値と一致していなくても実行されてしまいます。 この「デフォルトでフォールスルーする」挙動は、JavaScriptでswitchを使うときによくある落とし穴です。 関数の中では、この問題を避けるためにbreakの代わりにreturnを使うこともできます。

複数のケースに同じコードを適用したいときは、このフォールスルーの挙動を逆に利用できます。 その例はMDNのドキュメントで確認できます。

スコープ

デフォルトでは、それぞれのcase文の中の変数は同じスコープを共有します。 そのため、予期しない挙動を招くことがあります。 たとえば、あるケースをコピー&ペーストした結果、2つのケースにlet messageの宣言ができてしまい、エラーになることがあります。詳しくはMDNのドキュメントを参照してください。 スコープの共有による問題を避けるには、各case文に波括弧でブロックを作り、ケースごとに別々のスコープを作ります。

switch (x) {
  case option1: {
    // Variables declared here are contained to this case.
    break;
  }
  case option2: {
    // ...
    break;
  }
  default: {
    // ...
  }
}

式を使う

変数xの代わりに式を使うこともできます。 その式はswitch文の最初に1回だけ評価され、結果が各ケースと比較されます。 よくある使い方として、変数の型に応じて異なるコードを実行する「型によるswitch」があります。

switch (typeof x) {
  case 'string':
    // code that is executed when x is a string
    break;
  case 'number':
    // code that is executed when x is a number
    break;
  default:
    // code that is executed when x has some other type
}

値の部分にも式を使えます。