JavaScriptのswitchステートメント
例
ユーザー入力に基づいてコードのブロックを実行します。
var text;
var fruits = document.getElementById("myInput").value;
switch(fruits) {
case "Banana":
text = "Banana is good!";
break;
case "Orange":
text = "I am not a fan of orange.";
break;
case "Apple":
text = "How you like them apples?";
break;
default:
text = "I have never heard of that fruit...";
}
以下の「自分で試してみてください」の例をもっと見てください。
定義と使用法
switchステートメントは、さまざまなケースに応じてコードのブロックを実行します。
switchステートメントは、JavaScriptの「条件付き」ステートメントの一部であり、さまざまな条件に基づいてさまざまなアクションを実行するために使用されます。スイッチを使用して、実行するコードの多くのブロックの1つを選択します。これは、ネストされた長いif / elseステートメントに最適なソリューションです。
switchステートメントは式を評価します。次に、式の値が構造内の各ケースの値と比較されます。一致するものがある場合、関連するコードブロックが実行されます。
switchステートメントは、breakまたはdefaultキーワード（あるいはその両方）と一緒に使用されることがよくあります。これらは両方ともオプションです。
breakキーワードは、スイッチブロックから抜け出します。これにより、ブロック内でのコードの実行やケーステストの実行が停止します。breakを省略すると、switchステートメントの次のコードブロックが実行されます。
defaultキーワードは、大文字と小文字が一致しない場合に実行するコードを指定します。スイッチには、デフォルトのキーワードは1つしか存在できません。これはオプションですが、予期しないケースに対処するため、使用することをお勧めします。
構文
switch(expression) {
case n:
code block
break;
case n:
code block
break;
default:
default code block
}
パラメータ値
| Parameter | Description |
|---|---|
| expression | Required. Specifies an expression to be evaluated. The expression is evaluated once. The value of the expression is compared with the values of each case labels in the structure. If there is a match, the associated block of code is executed |
その他の例
例
今日の平日番号を使用して、平日の名前を計算します（Sunday = 0、Monday = 1、Tuesday = 2、...）：
var day;
switch (new Date().getDay()) {
case 0:
day = "Sunday";
break;
case 1:
day = "Monday";
break;
case 2:
day = "Tuesday";
break;
case 3:
day = "Wednesday";
break;
case 4:
day = "Thursday";
break;
case 5:
day = "Friday";
break;
case 6:
day = "Saturday";
break;
default:
day = "Unknown Day";
}
例
今日が土曜日でも日曜日でもない場合は、デフォルトのメッセージを記述します。
var text;
switch (new Date().getDay()) {
case 6:
text = "Today is Saturday";
break;
case 0:
text = "Today is Sunday";
break;
default:
text = "Looking forward to the Weekend";
}
例
場合によっては、異なるケースで同じコードを使用したり、共通のデフォルトにフォールスルーしたりする必要があります。
この例では、ケースが同じコードブロックを共有し、デフォルトのケースがスイッチブロックの最後のケースである必要はないことに注意してください（ただし、デフォルトがスイッチブロックの最後のケースでない場合は、必ず終了してください。休憩あり）。
var text;
switch (new Date().getDay()) {
case 1:
case 2:
case 3:
default:
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;
default:
text = "I have never heard of that one..";
}
関連ページ
JavaScriptチュートリアル：JavaScript If ... Elseステートメント
JavaScriptチュートリアル：JavaScriptSwitchステートメント
JavaScriptリファレンス：JavaScript if / elseステートメント
JavaScriptリファレンス：JavaScriptbreakステートメント
ブラウザのサポート
switch ECMAScript1（ES1）機能です。
ES1（JavaScript 1997）は、すべてのブラウザーで完全にサポートされています。
| Chrome | IE | Edge | Firefox | Safari | Opera |
| Yes | Yes | Yes | Yes | Yes | Yes |