フォールスルーでバグを起こしやすい実例集（修正版つき）
switch文のフォールスルーは便利ですが、意図しない抜け落ち（break忘れ）でバグが起きやすいポイントでもあります。
ここでは、初心者〜中級者がよくハマる 実際にありがちな5つのバグ例 を紹介し、修正版＋解説付きで比較します。
❌ 例1：break忘れによる「二重出力」
バグあり版
let fruit = "apple";
switch (fruit) {
case "apple":
console.log("りんごです");
case "banana":
console.log("バナナです");
break;
}
出力結果：
りんごです
バナナです
修正版
let fruit = "apple";
switch (fruit) {
case "apple":
console.log("りんごです");
break;
case "banana":
console.log("バナナです");
break;
}
正しい出力：
りんごです
解説
breakがないと 次の case まで実行されてしまう（フォールスルー）。- この例のように「apple」でも「banana」が出てしまうのは典型的バグ。
❌ 例2：default が意図せず実行される
バグあり版
let color = "red";
switch (color) {
case "red":
console.log("赤です");
default:
console.log("不明な色です");
}
出力：
赤です
不明な色です
修正版
let color = "red";
switch (color) {
case "red":
console.log("赤です");
break;
default:
console.log("不明な色です");
}
正しい出力：
赤です
解説
defaultも通常の case と同じ扱いなので、上のcaseでbreakを忘れると続けて実行される。- 「defaultは最後だから安全」と思い込むと危険。
❌ 例3：数値判定で複数条件を混同
バグあり版
let score = 80;
switch (score) {
case score >= 90:
console.log("A");
break;
case score >= 70:
console.log("B");
break;
default:
console.log("C");
}
出力：
C
修正版
let score = 80;
if (score >= 90) {
console.log("A");
} else if (score >= 70) {
console.log("B");
} else {
console.log("C");
}
正しい出力：
B
解説
switchは「値の一致比較（===）」を行う。
→score >= 70は true か false なので、caseと一致しない。- 範囲判定には switch は不向き。if文を使おう。
❌ 例4：似た文字列の混同（スペルミス）
バグあり版
let command = "Start";
switch (command) {
case "start":
console.log("開始します");
break;
case "stop":
console.log("停止します");
break;
default:
console.log("不明なコマンドです");
}
出力：
不明なコマンドです
修正版
let command = "Start";
switch (command.toLowerCase()) {
case "start":
console.log("開始します");
break;
case "stop":
console.log("停止します");
break;
default:
console.log("不明なコマンドです");
}
正しい出力：
開始します
解説
- JavaScript の
switchは 大文字・小文字を区別する。 .toLowerCase()や.toUpperCase()で統一するのが安全。
❌ 例5：意図的フォールスルーの説明忘れ（メンテで事故）
一見OKだが、後で危険になるコード
let status = "urgent";
switch (status) {
case "urgent":
console.log("緊急対応");
case "warning":
console.log("警告レベル");
break;
}
出力：
緊急対応
警告レベル
修正版（コメントで意図を明示）
let status = "urgent";
switch (status) {
case "urgent":
console.log("緊急対応");
// fall through （警告レベルも表示したい）
case "warning":
console.log("警告レベル");
break;
}
解説
- フォールスルーをあえて使う場合はコメントで明示。
- チーム開発では「break忘れ」と誤解されやすく、バグの温床に。
まとめ表
| # | 問題タイプ | バグ原因 | 修正方法 |
|---|---|---|---|
| 1 | break忘れ | 意図せず次のcaseが実行 | 各case末尾にbreak |
| 2 | default誤実行 | 最後のbreak忘れ | breakを追加 |
| 3 | 条件式の誤用 | switchは===比較 | if/elseで書き換える |
| 4 | 文字列ミス | 大文字小文字区別 | toLowerCase()で統一 |
| 5 | 意図的フォールスルー | コメントなし | // fall through を明記 |
💬 補足
- ESLint（静的解析ツール）では、「breakがないcase」に警告を出す設定（
no-fallthrough）があります。 - チーム開発では、このルールを有効にするのがおすすめです。
