JavaScriptのswitch文

定義と用法

switch文は異なる状況に応じてコードブロックを実行します。

switch文脈はJavaScriptの「条件」文の一部であり、異なる条件に応じて異なる操作を実行するために使用されます。switchを使って、実行する多くのコードブロックのうちの1つを選択します。これは長いネストされたif/else文の完璧な解決策です。

switch文はexpressionを計算し、その値を構造内の各caseの値と比較します。一致した場合、関連するコードブロックを実行します。

switch文は通常、breakまたはdefaultキーワード（またはその両方）と一緒に使用されます。これらはオプションです：

breakキーワードはswitchブロックから脱出します。これにより、ブロック内のさらなるコードの実行および/またはケーステストを停止します。breakを省略すると、switch文内の次のコードブロックを実行します。

caseに一致しなかった場合、defaultキーワードが指定するコードを実行します。switchの中で一つのdefaultキーワードしか存在しません。オプションですが、推奨します。なぜなら、予期せぬ状況を処理できるからです。

例

ユーザー入力に基づいてコードブロックを実行します：

var text;
var fruits = document.getElementById("myInput").value;
switch(fruits) {
  case "Banana":
    text = "バナナは美味しいです！";
    break;
  case "Orange":
    text = "オレンジが好きではありません。";
    break;
  case "Apple":
    text = "リンゴはどうですか？";
    break;
  デフォルト:
    text = "その果物は聞いたこともありません...";
}

実際に試してみてください

ページの下部にTIY例がさらにあります。

構文

switch(expression) {
  case n:
    コードブロック
    break;
  case n:
    コードブロック
    break;
  デフォルト:
    デフォルトのコードブロック
}

パラメータの値

パラメータ 説明
expression 必須。計算する表达式を指定します。expressionは一度計算されます。expressionの値は構造内の各caseタグの値と比較されます。一致した場合、関連するコードブロックを実行します。

技術的詳細

JavaScript バージョン： ECMAScript 1

更多例

例

今日のweekday番号を使用してweekday名前を計算します (Sunday=0, Monday=1, Tuesday=2, ...)：

var day;
switch (new Date().getDay()) {
  case 0:
    day = "日曜日";
    break;
  case 1:
    day = "月曜日";
    break;
  case 2:
    day = "火曜日";
    break;
  case 3:
    day = "水曜日";
    break;
  case 4:
    day = "木曜日";
    break;
  case 5:
    day = "Friday";
    break;
  case 6:
    day = "Saturday";
    break;
  デフォルト:
    day = "Unknown Day";
}

実際に試してみてください

例

今日が土曜日でも日曜日でもない場合、デフォルトのメッセージを書きます：

var text;
switch (new Date().getDay()) {
  case 6:
    text = "Today is Saturday";
    break; 
  case 0:
    text = "Today is Sunday";
    break; 
  デフォルト: 
    text = "Looking forward to the Weekend";
}

実際に試してみてください

例

場合によっては、異なる状況が同じコードを使用したり、同じデフォルト値を使用したい場合があります。

注意事項：この例では、case が同じコードブロックを共有しており、デフォルトケースは switch ブロックの最後の case にしなくてもよくありません（ただし、デフォルトが switch ブロックの最後の case でない場合は、それを終了するために break を使用する必要があります）。

var text;
switch (new Date().getDay()) {
  case 1:
  case 2:
  case 3:
  デフォルト: 
    text = "Looking forward to the Weekend";
    break; 
  case 4:
  case 5:
    text = "Soon it is Weekend";
    break; 
  case 0:
  case 6:
    text = "It is Weekend";
}

実際に試してみてください

例

ユーザーがポップアップダイアログから入力した値に基づいて、switch 文言を使用してコードブロックを実行します：

var text;
var favDrink = prompt("What's your favorite cocktail drink?");
switch(favDrink) {
  case "Martini":
    text = "Excellent choice! Martini is good for your soul.";
    break;
  case "Daiquiri":
    text = "Daiquiri is my favorite too!";
    break;
  case "Cosmopolitan":
    text = "Really? Are you sure the Cosmopolitan is your favorite?";
    break;
  デフォルト:
    text = "I have never heard of that one..";
}

実際に試してみてください

ブラウザサポート

文言 Chrome IE Firefox Safari Opera
switch サポート サポート サポート サポート サポート

関連ページ

JavaScript 教程：JavaScript If...Else 文言

JavaScript 教程：JavaScript Switch 文

JavaScript リファレンスマニュアル：JavaScript if/else 文

JavaScript リファレンスマニュアル：JavaScript break 文