switch 文で値を一覧から選ぶ
このレッスンで分かること
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 (式) {
case 値1:
// 値1 のときの処理
break;
case 値2:
// 値2 のときの処理
break;
default:
// どの値にも当てはまらないときの処理
}switch (式) の 式 を、各 case の値と === で比較します。一致した case から処理が始まり、break で switch を抜けます。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 する書き方は実用的でよく使われます。
入力 n | マッチする case | 戻り値 |
|---|---|---|
1 | case 1: | '月' |
4 | case 4: | '木' |
7 | case 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:の後にbreakもreturnもないので、続けてcase 7:のブロックに流れ込みます。「6または7のとき」を表現するイディオムです。
if / else if との使い分け
switch と if / else if は表現できる範囲が違います。switch は「ひとつの式の値が、特定の値と一致するか」を判定するための構文なので、等値マッチングだけ が得意です。一方で if / else if は score >= 60 のような 範囲条件 や 複合条件 (a && b) を自由に書けます。
| 条件の種類 | 向く構文 | 例 |
|---|---|---|
| 等値マッチング | switch | 曜日番号、ステータスコード、コマンド名 |
| 範囲条件 | if / else if | score >= 80、年齢区分 |
| 複合条件 | if / else if | a && b、x || y |
| パターン分解 | switch (true) 技 か match | 一覧 + ガード |
値の一覧マッチング (曜日、月、ステータスコード、コマンド名など) は
switchを、範囲条件や複雑な論理が混ざるものはif / else ifを選ぶ、という指針で使い分けると迷いません。
よくある間違い
breakの書き忘れ。case 1: x = 'A'; case 2: x = 'B';のように書くと、1に一致しても続けて'B'が代入されてしまいます。returnを使わない場合は 必ずbreakを書きましょう。case '1':と書いてしまう。switchの比較は===(厳密一致) なので、switch (1) { case '1': ... }は当たりません。型を合わせます。defaultを書き忘れる。想定外の値が来たときに何も起きず、undefinedが返るバグが入りやすくなります。
ここまでの要点
switch は === の等値マッチング専用。return を使えば break を省略できる。case 6: case 7: でまとめ書き、範囲条件は if/else の出番。
やってみよう
整数 n を受け取り、1 を '月'、2 を '火'、… 7 を '日' に変換する関数 weekdayJp を switch 文で実装してください。手順は次のとおりです。
function weekdayJp(n) { ... }で関数を定義するswitch (n) { case 1: return '月'; ... }で 7 ケースを並べるdefault: return '不明';で範囲外をカバー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 つができることを確認しましょう。
- switch 文で曜日 の要点を自分の言葉で説明できる
- このレッスンの最小コード (または操作手順) を見ずに書ける
- 練習問題やクイズで間違えた箇所を読み直して理解した
理解度チェック (30 秒)
Q. switch 文で曜日 とは何か、1 文で説明してください。
A. 本文の「このレッスンで分かること」または冒頭の説明文を見直し、自分の言葉で要約できれば OK。詰まったら本レッスンの最初の H2 セクションを読み返してみましょう。
関連レッスン
要件
- switch 文を使って分岐すること
- 1〜7 を月〜日の日本語 1 文字に変換すること
- 範囲外は default で '不明' を返すこと
入出力例
test-cases.txt
weekdayJp(1) → "月"
weekdayJp(3) → "水"
weekdayJp(5) → "金"
weekdayJp(7) → "日"
weekdayJp(0) → "不明"
weekdayJp(8) → "不明"