switch文を使った条件分岐

JavaScript で条件分岐を行う方法のひとつである switch 文の使い方について解説します。 switch 文では複数の値の中のいずれかと一致するかどうかを調べ、実行する処理を分けることができます。

(Last modified: )

switch文の基本書式

switch 文は対象となる値が、いずれかの値と一致するかどうかを調べ処理を分けることができます。書式は次の通りです。

switch (式){
  case 値1:
    式 === 値1 の時に実行する処理;
    ...
    break;
  case 値2:
    式 === 値2 の時に実行する処理;
    ...
    break;
  case 値3:
    式 === 値3 の時に実行する処理;
    ...
    break;
  default:
    式がいずれの値とも一致しないときに実行する処理;
    ...
}

switch のあとの () に記述した式を評価し、その値が case の後に書かれたいずれかの値と一致するかどうかを調べます(一致するかどうかは == 演算子ではなく === 演算子を使って比較されます)。一致するものが見つかった場合は、その case 句の後に記述されている処理を switch 文の最後または break 文まで順に実行します。

いずれの値とも一致しなかった場合は default 句の後に記述されている処理を実行します。 default 句は不要であれば省略可能です。

式のところには直接値や変数を記述してもいいですし、計算式などを記述することもできます。

次の例を見てください。

let pref = 'Osaka';

switch (pref){
  case 'Tokyo':
    console.log('住所は東京都です');
    break;
  case 'Osaka':
    console.log('住所は大阪府です');
    break;
  default:
    console.log('住所はその他です');
}

変数 pref に格納されている値を case の値に書かれいる値と等しいかどうか比較していきます。今回は一致する case があったので、その次の文から switch 文の最後または break まで処理が実行されます。

let pref = 'Osaka';

switch (pref){
  case 'Tokyo':
    console.log('住所は東京都です');
    break;
  case 'Osaka':
    console.log('住所は大阪府です');
    break;
  default:
    console.log('住所はその他です');
}

>> 住所は大阪府です

なお先ほどの例を switch 文ではなく if 文を使って書き換えると次のようになります。

let pref = 'Osaka';

if (pref === 'Tokyo'){
  console.log('住所は東京都です');
}else if (pref === 'Osaka'){
  console.log('住所は大阪府です');
}else{
  console.log('住所はその他です');
}

if 文を使い数多くの値と === 演算子を使って一致するものがないかどうか調べたい場合に、 switch 文を使うことでより分かりやすく記述することができます。

break文を記述しなかった場合

switch 文では case 句ごとにブロックを記述しません。値が一致する case 句が見つかった場合、その次の文から switch 文の最後または break まで順に処理が実行されていきます。

次の break 文がない switch のサンプルを見てください。

let pref = 'Osaka';

switch (pref){
  case 'Tokyo':
    console.log('住所は東京都です');
  case 'Osaka':
    console.log('住所は大阪府です');
  case 'Aichi':
    console.log('住所は愛知県です');
  default:
    console.log('住所はその他です');
}

実際に実行してみると次のような結果となります。

let pref = 'Osaka';

switch (pref){
  case 'Tokyo':
    console.log('住所は東京都です');
  case 'Osaka':
    console.log('住所は大阪府です');
  case 'Aichi':
    console.log('住所は愛知県です');
  default:
    console.log('住所はその他です');
}

>> 住所は大阪府です
>> 住所は愛知県です
>> 住所はその他です

今回は変数 pref に格納されている値が case 'Osaka' と一致するのでその次の文から順に実行していきますが、 break 文がないのでそのまま switch 文の最後まで順に実行されました。

意図的にこのような処理を行わせることもできますが、通常は caes 句ごとに必要な文を実行したら switch 文の次へ処理を移したいと思います。そこで case 句ごとに最後に break 文を記述します。

let pref = 'Osaka';

switch (pref){
  case 'Tokyo':
    console.log('住所は東京都です');
    ...
    ...
    break;
  case 'Osaka':
    console.log('住所は大阪府です');
    ...
    ...
    break;
  case 'Aichi':
    console.log('住所は愛知県です');
    ...
    ...
    break;
  default:
    console.log('住所はその他です');
}

break 文が実行されると switch 文の次へ処理が移るため、それ以降に記述された文が実行されることはなくなります。なお default 句は通常は最後に記述するので break 文を書く必要はありません。

複数の値に対して同じ処理を実行する

switch 文では case 句のあとに記述された値と一致するかどうかを見ていきますが、意図的に break 文を記述しないことで複数の値に対して同じ処理を実行させることができます。

次の switch のサンプルを見てください。

let ans = '8月';

switch (ans){
  case '8月':
  case '八月':
  case 'August':
    console.log('正解です');
    break;
  default:
    console.log('不正解です');
}

>> 正解です

変数 ans の値が 'August' の場合に console.log('正解です') を実行しますが、変数 ans の値が '8月' または '八月' の場合も同じ文を実行します。 switch 文では値が一致する case 句が見つかった場合、その次の文から switch 文の最後または break まで順に処理が実行されていくためです。

-- --

JavaScript で条件分岐を行う方法のひとつである switch 文の使い方について解説しました。

( Written by Tatsuo Ikura )

Profile
profile_img

著者 / TATSUO IKURA

プログラミングや開発環境構築の解説サイトを運営しています。