JavaScriptのswitch文の基本構文と使いどころを学ぼう!初心者でもわかる条件分岐の書き方
先生と生徒の会話形式で理解しよう
生徒
「先生、JavaScriptで複数の条件によって処理を変えたいとき、どう書けばいいですか?」
先生
「複数の条件がある場合は、switch文を使うとわかりやすく書けます。if文でもできますが、条件がたくさんあるとコードが長くなってしまいます。」
生徒
「switch文ってどんなふうに書くんですか?」
先生
「では基本の書き方から説明しますね!」
1. switch文とは?基本構文を見てみよう
switch文は、ある値が何と等しいかを調べて、それぞれの場合に応じた処理を行うための書き方です。複数の選択肢があるときに使うことが多いです。
基本構文は次の通りです。
switch (式) {
case 値1:
// 値1の場合の処理
break;
case 値2:
// 値2の場合の処理
break;
// 他のcaseも続ける
default:
// どのcaseにも当てはまらない場合の処理
}
ここで、switchの後の式は評価される値で、それとcaseの値を順番に比べていきます。caseの値に一致するものがあれば、その処理を実行します。
breakは処理をそこで終わらせるために必要な命令で、これを書かないと次のcaseの処理まで続けて実行されてしまいます。
defaultは、どのcaseにも当てはまらない場合に実行される処理です。省略もできますが、エラー防止のため書くことが多いです。
2. switch文の簡単な例:曜日ごとにメッセージを変える
たとえば、曜日の番号(0〜6)に応じて、その曜日名を表示する例を見てみましょう。
let day = 3;
let dayName;
switch (day) {
case 0:
dayName = "日曜日";
break;
case 1:
dayName = "月曜日";
break;
case 2:
dayName = "火曜日";
break;
case 3:
dayName = "水曜日";
break;
case 4:
dayName = "木曜日";
break;
case 5:
dayName = "金曜日";
break;
case 6:
dayName = "土曜日";
break;
default:
dayName = "不正な曜日です";
}
console.log(dayName);
水曜日
この例では、変数dayが3なので、水曜日のメッセージが表示されます。
3. switch文を使うメリット
- コードが見やすくなる
たくさんの条件分岐を整理して書けるので、読みやすくなります。 - 複数の値に対する処理を簡単に書ける
同じ変数の値に対して処理を変える場合に便利です。 - ミスを減らせる
書き方が決まっているので、条件漏れや記述ミスを防ぎやすいです。
4. switch文の注意点とポイント
- breakの書き忘れに注意
breakを書かないと、次のcaseの処理まで続けて実行されてしまいます。意図的に続けることもありますが、初心者は特に気を付けましょう。 - 式の値は厳密比較される
switchは比較に===(型と値が両方等しい)を使います。型が違うと一致しません。 - 複雑な条件には向かない
範囲判定や複雑な条件にはif文を使うほうがわかりやすいです。
5. switch文の活用例:簡単なメニュー選択
ユーザーが入力したメニュー番号に応じて料理名を表示する例です。
let menu = 2;
let dish;
switch (menu) {
case 1:
dish = "カレーライス";
break;
case 2:
dish = "ハンバーグ";
break;
case 3:
dish = "ラーメン";
break;
default:
dish = "メニューにありません";
}
console.log(dish);
ハンバーグ
こうした選択肢が複数ある処理は、switch文が便利です。
6. よくある質問:switch文のdefaultは必須ですか?
defaultは必須ではありませんが、予期しない値が来たときに備えて書いておくのが安全です。エラーの原因を見つけやすくなります。
7. まとめない代わりに簡単ポイント整理
switch文は複数の条件分岐を整理して書くのに便利。- 各
caseの最後にはbreakを書くのを忘れない。 defaultで例外処理を書くと安全。- 複雑な条件や範囲判定は
if文のほうが向いている。