JavaScript switch case

概要: このチュートリアルでは、複数の条件に基づいてコードブロックを実行するために、JavaScriptのswitch文を使用する方法を学習します。

JavaScript switch case文の紹介

switch文は、式を評価し、その結果をcase値と比較し、一致するcase値に関連付けられた文を実行します。

以下は、switch文の構文を示しています。

switch (expression) {
    case value1:
        statement1;
        break;
    case value2:
        statement2;
        break;
    case value3:
        statement3;
        break;
    default:
        statement;
}Code language: JavaScript (javascript)

仕組み

• まず、switchキーワードの後の括弧内の式を評価します。
• 次に、式の結果を、caseブランチのvalue1、value2、…と上から順に比較します。 switch文は厳密比較（===）を使用します。
• 3番目に、式の結果がcaseキーワードの後の値と等しいcaseブランチの文を実行します。 break文はswitch文を終了します。 break文を省略すると、コードの実行は元のcaseブランチから次のブランチにフォールスルーします。 式の結果がどの値にも厳密に等しくない場合、switch文はdefaultブランチの文を実行します。

switch文は、一致するものが見つかった時点で、式の結果と残りのcase値の比較を停止します。

switch文はif…else…if文に似ています。しかし、より読みやすい構文を持っています。

次のフローチャートは、switch文を示しています。

実際には、コードを読みやすくするために、複雑なif-else-if文を置き換えるために、switch文がよく使用されます。

技術的には、switch文は次のif-else-if文と同等です。

if (expression === value1) {
  statement1;
} else if (expression === value2) {
  statement2;
} else if (expression === value3) {
  statement3;
} else {
  statement;
}
Code language: JavaScript (javascript)

JavaScript switch caseの例

JavaScriptのswitch文を使用する例をいくつか見てみましょう。

1) JavaScript switch文を使用して曜日を取得する

次の例では、switch文を使用して、日番号に基づいて曜日を取得します。

let day = 3;
let dayName;

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

console.log(dayName); // TuesdayCode language: JavaScript (javascript)

出力

Tuesday

仕組み

まず、日番号を保持するday変数と曜日名変数（dayName）を宣言します。

次に、switch文を使用して、日番号に基づいて曜日を取得します。日が1の場合、曜日は日曜日です。日が2の場合、曜日は月曜日などとなります。

3番目に、曜日をコンソールに出力します。

2) JavaScript switch文を使用して、月に基づいて日数を取得する

次の例では、switch文を使用して、月のカウント日を取得します。

let year = 2016;
let month = 2;
let dayCount;

switch (month) {
  case 1:
  case 3:
  case 5:
  case 7:
  case 8:
  case 10:
  case 12:
    dayCount = 31;
    break;
  case 4:
  case 6:
  case 9:
  case 11:
    dayCount = 30;
    break;
  case 2:
    // leap year
    if ((year % 4 == 0 && !(year % 100 == 0)) || year % 400 == 0) {
      dayCount = 29;
    } else {
      dayCount = 28;
    }
    break;
  default:
    dayCount = -1; // invalid month
}

console.log(dayCount); // 29Code language: JavaScript (javascript)

この例では、4つのケースがあります。

• 月が1、3、5、7、8、10、または12の場合、1か月の日数は31です。
• 月が4、6、9、または11の場合、その月の日数は30です。
• 月が2で、年がうるう年でない場合、日数は28です。年がうるう年の場合、日数は29です。
• 月が有効な範囲（1〜12）にない場合、defaultブランチが実行され、dayCount変数に-1が設定されます。これは、無効な月を示します。

まとめ

• switch文は式を評価し、その結果をcase値と比較し、一致するcaseに関連付けられた文を実行します。
• コードを読みやすくするために、複雑なif...else...if文ではなくswitch文を使用してください。
• switch文は、厳密比較（===）を使用して、式とcase値を比較します。