の JavaScriptのswitch文 式を評価し、一致するケースに基づいてコードのブロックを実行します。これは長い if-else チェーンの代替手段を提供し、特に複数の条件付き分岐を処理する場合の可読性と保守性を向上させます。

目次

• Switch ステートメントの構文
• Switch ステートメントの仕組み
• Switch文のフローチャート
• 共通のコードブロック

Switch ステートメントの構文

switch (expression) {  case value1:  // code block 1;  break;  case value2:  // code block 2;  break;  ...  default:  // default code block; }>

• Expression> は比較したい値です。
• Case value1>、case value2>、などは、の可能な値を表します。expression>。
• break>ステートメントは終了しますswitch>声明。これがないと、実行は次のケースに継続されます。
• Default>どのケースも一致しない場合に実行するコードを指定します。expression>。

Switch ステートメントの仕組み

• 評価 : 内の式switch>ステートメントは 1 回評価されます。
• 比較 : 式の値をそれぞれと比較します。case>ラベル (厳密な等価性を使用)===>）。
• 実行 : 一致が見つかった場合、一致に続く対応するコード ブロックcase>ラベルが実行されます。一致するものが見つからない場合、実行は次の場所にジャンプします。default>case (存在する場合) または、次のステートメントに続きます。switch>ブロック。
• ブレークステートメント : コード ブロックの実行後、break>ステートメントは終了しますswitch>ステートメントを作成し、後続のケースで実行が失敗するのを防ぎます。もしbreak>が省略された場合、実行は次のケースに続行されます (フォールスルーと呼ばれます)。
• デフォルトのケース : のdefault>ケースはオプションです。一致するものが見つからない場合は、以下のコード ブロックがdefault>が実行されます。

Switch文のフローチャート

Switch ステートメントの例:

ここでは3日目の曜日名を印刷します。

let day = 3; let dayName; switch (day) {  case 1:  dayName = 'Monday';  break;  case 2:  dayName = 'Tuesday';  break;  case 3:  dayName = 'Wednesday';  break;  case 4:  dayName = 'Thursday';  break;  case 5:  dayName = 'Friday';  break;  case 6:  dayName = 'Saturday';  break;  case 7:  dayName = 'Sunday';  break;  default:  dayName = 'Invalid day'; } console.log(dayName); // Output: Wednesday>

Wednesday>

説明：

• Day>に設定されています3>。
• のswitch>ステートメントが評価するday>。
• 以来day>は3>、case 3>ブロックが実行され、割り当てが行われます'Wednesday'>にdayName>。
• のbreak>ステートメントは終了しますswitch>ステートメントを削除し、他のケースへの実行の続行を妨げます。

Switch ステートメントの例:

ここではスイッチケースを使ってグレードを確認してみます。

let grade = 'B'; let result; switch (grade) {  case 'A':  result = 'A (Excellent)';  break;  case 'B':  result = 'B (Average)';  break;  case 'C':  result = 'C (Below than average)';  break;  default:  result = 'No Grade'; } console.log(result);>

B (Average)>

説明：

• Grade>値が割り当てられます'B'>。
• のswitch>ステートメントは次の値を評価しますgrade>。
• 以来grade>は'B'>、次のコードブロックcase 'B':>が実行されます。
• のresult>変数には文字列が割り当てられます'B (Average)'>。
• のbreak>ステートメントは終了しますswitch>声明。
• result>コンソールに記録され、次のように出力されます。'B (Average)'>。

キーワードを破る

のbreak>キーワードは、ループまたはswitch>声明。

デフォルトのキーワード

のdefault>キーワードは内で​​使用されていますswitch>ステートメントをフォールバック オプションとして使用することはできません。case>式は評価される値と一致します。と同様に動作します。else>での声明if...else>チェーンを使用して、他の特定のケースが一致しない場合に実行するデフォルトのアクションを提供します。

デフォルトケースの位置は関係ありません。

デフォルトのケースは、その配置に関係なく、他のケース条件がいずれも満たされない場合にのみ実行されます。したがって、これを先頭、中間、または最後に配置しても、コアのロジックは変わりません (フォールスルーと呼ばれるあまり一般的ではない手法を使用している場合を除く)。

デフォルトのケースを出力します。

let day = 8; let dayName; switch (day) {  default:  dayName = 'Invalid day';  break;  case 1:  dayName = 'Monday';  break;  case 2:  dayName = 'Tuesday';  break;  case 3:  dayName = 'Wednesday';  break;  case 4:  dayName = 'Thursday';  break;  case 5:  dayName = 'Friday';  break;  case 6:  dayName = 'Saturday';  break;  case 7:  dayName = 'Sunday';  break;   } console.log(dayName);>

Invalid day>

共通のコードブロック

場合によっては、複数の切り替えケースに同じコードを使用する必要があります。その方法の例を見てみましょう。

共通のコードブロック 例：

ここでは、2 つの異なるスイッチの場合に同じコード ブロックを使用します。

let grade = 'A' let result; switch (grade) {  case 'A':  result = 'Grade is excellent'  break;  case 'B':  result = 'Grade is good'  break;  case 'C':  result = 'Grade is Average '  break;  case 'D':  result = 'Grade is Poor'  break;  default:  text = 'NO grades achieved'; } console.log(result)>

Grade is excellent>

説明：

• Grade>値が割り当てられます'A'>。
• のswitch>ステートメントは次の値を評価しますgrade>。
• 以来grade>マッチ'A'>、次のコードブロックcase 'A':>実行、設定result>に'Grade is excellent'>。
• のbreak>ステートメントは終了しますswitch>声明。
• Result>コンソールに記録され、次のように出力されます。'Grade is excellent'>。

注記： 複数のスイッチ ケースが値と一致する場合、最初のスイッチ ケースが実行されます。