switch 文で値を一覧から選ぶ

生田 陸人
LuaGate エンジニア / 現役エンジニア
編集 LuaGate編集部

このレッスンで分かること

  • switch (式) { case 値: ...; break; default: ... } で等値マッチング (===) の多分岐を書きます
  • break を書き忘れると次の case まで流れ落ちる (fall-through)
  • 最小例は switch (n) { case 1: return '月'; ...; default: return '不明'; }

switch 文で値を一覧から選ぶ とは

1〜7 の整数を月〜日の日本語曜日に変換する関数を switch で書く。本レッスンでは、switch 文で値を一覧から選ぶ の基本から実際の使いどころまでを整理し、現場で迷わず使える形に落とし込みます。

switch 文で値を一覧から選ぶ

if / else if を何回もつなげると、見た目がだんだん「縦長の階段」になってきます。else if (x === 1) ... else if (x === 2) ... のように 同じ値を等値比較しているだけ なら、switch 文に書き換えた方がすっきりします。switch は「ひとつの式の値に対して、どの case に当てはまるか」を表現するための専用構文です。

言葉で言うと「変数の値に応じて、ラベルが書かれた引き出しから対応するものを取り出す」イメージです。複数の値を 1 つの式に対して試したいとき、switch の方が見通しが良くなります。

switch の文法

基本形は次のとおりです。

JavaScript

switch () { case1: // 値1 のときの処理 break; case2: // 値2 のときの処理 break; default: // どの値にも当てはまらないときの処理 }

switch (式) を、各 case の値と === で比較します。一致した case から処理が始まり、breakswitch を抜けます。break を書き忘れると、次の case まで そのまま実行が流れ落ちる (fall-through) ので注意が必要です。

default は「どの case にも一致しなかったとき」に実行されます。else の役目です。場所はどこでも書けますが、慣習的に最後に置くのが普通です。

動きを追ってみる

例として、整数 1〜7'月' '火' '水' '木' '金' '土' '日' に変換する関数を書きます。

JavaScript

function weekdayJp (n) { switch (n) { case 1: return '月'; case 2: return '火'; case 3: return '水'; case 4: return '木'; case 5: return '金'; case 6: return '土'; case 7: return '日'; default: return '不明'; } } weekdayJp(1); // '月' weekdayJp(8); // '不明'

return を書いた場合は break を書かなくても関数を抜けてくれます。switch の中で return する書き方は実用的でよく使われます。

diagram (will load when visible)
入力 nマッチする case戻り値
1case 1:'月'
4case 4:'木'
7case 7:'日'
0どれも合わないdefault'不明'
'1'どれも合わない (=== で型不一致)default'不明'

図のように、switch は「等値マッチング専用」と覚えると整理しやすいです。範囲指定の >=< には向きません。

case をまとめる

複数の値で同じ処理をしたいときは、case を続けて書きます。これはあえて fall-through を活用する書き方です。

JavaScript

function isWeekend (n) { switch (n) { case 6: case 7: return true; default: return false; } } isWeekend(6); // true isWeekend(3); // false

case 6: の後に breakreturn もないので、続けて case 7: のブロックに流れ込みます。「6 または 7 のとき」を表現するイディオムです。

if / else if との使い分け

switchif / else if は表現できる範囲が違います。switch は「ひとつの式の値が、特定の値と一致するか」を判定するための構文なので、等値マッチングだけ が得意です。一方で if / else ifscore >= 60 のような 範囲条件複合条件 (a && b) を自由に書けます。

条件の種類向く構文
等値マッチングswitch曜日番号、ステータスコード、コマンド名
範囲条件if / else ifscore >= 80、年齢区分
複合条件if / else ifa && bx || y
パターン分解switch (true) 技 か match一覧 + ガード

値の一覧マッチング (曜日、月、ステータスコード、コマンド名など) は switch を、範囲条件や複雑な論理が混ざるものは if / else if を選ぶ、という指針で使い分けると迷いません。

よくある間違い

  1. break の書き忘れ。case 1: x = 'A'; case 2: x = 'B'; のように書くと、1 に一致しても続けて 'B' が代入されてしまいます。return を使わない場合は 必ず break を書きましょう。
  2. case '1': と書いてしまう。switch の比較は === (厳密一致) なので、switch (1) { case '1': ... } は当たりません。型を合わせます。
  3. default を書き忘れる。想定外の値が来たときに何も起きず、undefined が返るバグが入りやすくなります。
この章のポイント

ここまでの要点 switch=== の等値マッチング専用。return を使えば break を省略できる。case 6: case 7: でまとめ書き、範囲条件は if/else の出番。

やってみよう

整数 n を受け取り、1'月'2'火'、… 7'日' に変換する関数 weekdayJpswitch 文で実装してください。手順は次のとおりです。

  1. function weekdayJp(n) { ... } で関数を定義する
  2. switch (n) { case 1: return '月'; ... } で 7 ケースを並べる
  3. default: return '不明'; で範囲外をカバー
  4. weekdayJp(1)'月'weekdayJp(8)'不明' を返すか確認

範囲外 (0 以下や 8 以上) の場合は '不明' を返します。return を使えば break は省略できます。

よくある質問

Q. ブラウザと Node.js で動作は変わりますか?

A. JavaScript の構文・組み込み機能(配列・文字列・Promise 等)はどちらでも同じです。違いは DOM API(ブラウザ専用)と fs などのファイル系(Node 専用)など、実行環境固有の機能です。コアロジックは両方で動くため、テストもしやすくなります。

Q. ES6 以降の新機能は使っても大丈夫ですか?

A. 現代のブラウザ・Node.js は ES2020 以降の機能をほぼサポートしています。古い IE 等を対象にする必要が無ければ、let/const、アロー関数、分割代入、async/await を積極的に使ってください。トランスパイル(Babel/Vite)が必要なケースは年々減っています。

Q. TypeScript に進む価値はありますか?

A. 型情報があるとリファクタやエディタ補完が劇的に効くため、規模が大きくなるなら TypeScript への移行を強くおすすめします。最初は any を許容しつつ徐々に型を付ければ、JS の知識をそのまま活かせます。

次のレッスン

次は 早期 return でネストを浅くする で、1〜7 の整数を月〜日の日本語曜日に変換する関数を switch で書く を学びます。

事前確認 — 進む前に次の 3 つができることを確認しましょう。

  1. switch 文で曜日 の要点を自分の言葉で説明できる
  2. このレッスンの最小コード (または操作手順) を見ずに書ける
  3. 練習問題やクイズで間違えた箇所を読み直して理解した

理解度チェック (30 秒)

Q. switch 文で曜日 とは何か、1 文で説明してください。

この章のポイント

A. 本文の「このレッスンで分かること」または冒頭の説明文を見直し、自分の言葉で要約できれば OK。詰まったら本レッスンの最初の H2 セクションを読み返してみましょう。

関連レッスン

要件

  1. switch 文を使って分岐すること
  2. 1〜7 を月〜日の日本語 1 文字に変換すること
  3. 範囲外は default で '不明' を返すこと

入出力例

test-cases.txt

weekdayJp(1)"月" weekdayJp(3)"水" weekdayJp(5)"金" weekdayJp(7)"日" weekdayJp(0)"不明" weekdayJp(8)"不明"

ヒント

main.js
main.js
学習モード

メモ

switch 文で値を一覧から選ぶ

⌘S で保存