switch

式を評価し、式の値とマッチしたcase句の処理文を実行します。

文法

switch (expression) {
  case value1:
    // 式(expression)の結果がvalue1にマッチした際に実行される処理文です。
    statements1
    [break;]
  case value2:
    // 式(expression)の結果がvalue2にマッチした際に実行される処理文です。
    statements2
    [break;]
  ...
  case valueN:
    // 式(expression)の結果がvalueNにマッチした際に実行される処理文です。
    statementsN
    [break;]
  default:
    // 式(expression)の値がどれにもマッチしなかった際に実行される処理文です。
    statements_def
    [break;]
}
expression
case句に対してマッチさせる式を指定します。
case valueN
expressionに対してのマッチに使用されるcase句を指定します。
statementsN
expressionにマッチしたcase句に関連付いて実行される処理文です。
statements_def
expressionが、どのcase句にもマッチしなかった際に実行される処理文です。

説明

マッチするものが見つかると、プログラムは関連付けられている処理文を実行します。 もし提供された値が複数のcaseでマッチする場合は、 たとえ各caseが等価では無いとしても、最初にマッチしたcaseが選択されます。

プログラムはまずexpressionに入力された式と同じ値として評価される(厳格な比較===を使用)case句を探し、 そこに制御を移して、関連付けられている処理文を実行します。 マッチするcase句が無ければ、プログラムは任意で指定することが出来るdefault句を探し、 それが存在すれば制御をそこに移し、関連する処理文を実行します。 もし、default句が見つからない場合、プログラムはswitch文の後に続く処理文の実行を続けます。 慣習として、default句は最後に書かれますが、必ずそのようにする必要はありません。

caseに関連付けられる任意のbreak文は、 マッチした処理文が実行されるとswitchの外へプログラムが抜けて、 switchの後に続く処理文の実行を続行することを確約します。 もし、breakが省略されると、プログラムはswitch内の次の処理文の実行を続行します。

switchの使用例

下記の例は、exprが"Bananas"と評価されると、 プログラムは"Bananas"の値にマッチするcase句を見つけ、それに関連付く処理文を実行します。 breakに行き着いた際は、プログラムはswitchの外に抜けて、 switchの後に続く処理文を実行します。 もし、breakが省略されると、その下のcase "Cherries"の処理文も実行されてしまいます。

switch (expr) {
  case "Oranges":
    console.log("Oranges are $0.59 a pound.");
    break;
  case "Apples":
    console.log("Apples are $0.32 a pound.");
    break;
  case "Bananas":
    console.log("Bananas are $0.48 a pound.");
    break;
  case "Cherries":
    console.log("Cherries are $3.00 a pound.");
    break;
  case "Mangoes":
  case "Papayas":
    console.log("Mangoes and papayas are $2.79 a pound.");
    break;
  default:
    console.log("Sorry, we are out of " + expr + ".");
}

console.log("Is there anything else you'd like?");

例: もしbreakを忘れてしまうと、何が起こるのか?

もし、breakを忘れた場合、スクリプトは条件が満たされている場所から実行を始め、 その後は条件を満たしているいないに関わらず実行が続きます。 下記の例を参照してください。

var foo = 0;
switch (foo) {
    case -1:
        console.log('negative 1');
        break;
    case 0: // fooが0であれば、ここで条件が満たされ、このブロックが実行されます。
        console.log(0)
        // 注目!: ここでbrekaが忘れられています。
    case 1: // 'case 0:'でのbreka文が無いため、同様にこのcaseの処理文も実行されます。
        console.log(1);
        break; // このbureakに行き着くため、'case 2:'の実行は行われません。
    case 2:
        console.log(2);
        break;
    default:
        console.log('default');
}

例: 複数の条件を満たす書き方

もし、1つのcase部分に複数の条件を満たせるようにしたいのであれば、それには2つの方法があります。 方法(1)は推奨される方法であり、方法(2)は"ハッカー的な(? hacky)"方法です。 この2つの方法で、fooの値が0、1、2、3のいずれかの場合に、"yes"の警告ダイアログを表示してみます。

これらのテクニックは、下記がリンク先が元になっています。

  1. Multiple Criteria Single Case Switch Statement (Stack Overflow)
  2. Switch statement multiple cases in JavaScript (Stack Overflow)
方法(1)

この方法は、case文の下にbrekeが無ければ、 条件を満たす満たさないに関係なく次のcase文の実行続けるという動きを利用します。 このページの「例: もしbreakを忘れてしまうと、何が起こるのか?」を参照してください。

var foo = 1;
switch (foo) {
    case 0:
    case 1:
    case 2:
    case 3:
        alert('yes');
        break;
    default:
        alert('not');
}

方法(2)

これは"ハッカー的な"方法です。 2行目がswitch(foo)の代わりに、常にtrueであることに注目してください。 そして、条件のロジック(不変のtrueの代わりとなる)はcase文に置かれます。

var foo = 1;
switch (true) { // 変数fooの代わりに常にTRUE
    case foo >= 0 && foo <= 3:
        alert('yes');
        break;
    default:
        alert('not');
}

仕様

ブラウザ互換性

デスクトップ
機能 Chrome Firefox
(Gecko)
IE Opera Safari
基本
モバイル
機能 Android Chrome for
Android
Firefox
Mobile
IE
Mobile
Opera
Mobile
Safari
Mobile
基本

関連項目

 Back to top

© 2017 Mozilla Contributors
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.

このページは、ページトップのURL先のMozilla Developer Network(以下、MDN)のコンテンツを翻訳した内容を基に構成されています。 構成について異なる点も含まれますので、下記の項目を確認し、必要に応じて元のコンテンツをご確認ください。 もし、誤訳などの間違いを見つけましたら、 @tomofまで教えていただければ幸いです。

  • 特定のブラウザに特化しすぎている情報やあまりにも古い情報、 または試験的に導入されているようなAPIや機能については、省略していることがあります。
  • 例やデモについて、実際にページ内で動作させる関係で一部ソースコードを変更している場合や、 その例で使用しているコンテンツの単語や文章などを日本人向けに変更しいてる場合があります。
  • MDNの更新頻度が高いため、元のコンテンツと比べ情報が古くなっている可能性があります。
  • "訳注:"などの断わりを入れた上で、日本人向けの情報の追記を行っている事があります。