【サクッと解説】JavaScript if・switchによる条件分岐の基本と使い分け

2025年8月5日

1. 本記事のポイント

JavaScriptにおける条件分岐の基本構文（if文、switch文）を比較解説
各構文の用途・書き方・挙動の違いを具体的に説明
実務での使い分けやよくある誤解・ミスを防ぐポイントを整理

2. JavaScriptの条件分岐とは？

JavaScriptの条件分岐は、ある条件に応じて異なる処理を実行させる基本的な制御構文です。
主に使用されるのは「if文」と「switch文」で、比較的単純な分岐から複雑な多条件処理まで広く対応します。

if文は柔軟性が高く、数値・文字列・真偽値などの任意の条件式を記述できます。
switch文は、特定の値（多くは定数や列挙値）に対して複数の選択肢を効率的に分岐させる用途に向いています。

実務では、ユーザー入力の分岐、ステータスコードの処理、設定値による切り替えなどに多用されます。
使い分けを誤ると可読性や保守性が下がるため、両者の特性を正確に把握して選定することが重要です。

3. 詳細解説

条件が1つまたは少数のとき：if文の基本構文

if文は、条件式がtrueとなるかどうかで処理を分岐します。

JavaScript

const value = 10;

if (value > 5) {
  console.log("5より大きいです");
} else {
  console.log("5以下です");
}

// 出力："5より大きいです"

const value = 10;

if (value > 5) {
  console.log("5より大きいです");
} else {
  console.log("5以下です");
}

// 出力："5より大きいです"

if文は、else if を使って複数条件に対応できます。

JavaScript

const color = "red";

if (color === "blue") {
  console.log("青です");
} else if (color === "red") {
  console.log("赤です");
} else {
  console.log("その他の色です");
}

// 出力："赤です"

const color = "red";

if (color === "blue") {
  console.log("青です");
} else if (color === "red") {
  console.log("赤です");
} else {
  console.log("その他の色です");
}

// 出力："赤です"

値ごとに明確に分岐したいとき：switch文の基本構文

switch文は、1つの値に対して複数のcaseを用いて条件分岐します。

JavaScript

const status = "loading";

switch (status) {
  case "loading":
    console.log("読み込み中");
    break;
  case "success":
    console.log("成功しました");
    break;
  case "error":
    console.log("エラーが発生しました");
    break;
  default:
    console.log("不明な状態です");
}

// 出力："読み込み中"

const status = "loading";

switch (status) {
  case "loading":
    console.log("読み込み中");
    break;
  case "success":
    console.log("成功しました");
    break;
  case "error":
    console.log("エラーが発生しました");
    break;
  default:
    console.log("不明な状態です");
}

// 出力："読み込み中"

switchはbreakを忘れると意図せず次のcaseにも処理が流れるため注意が必要です。

ifとswitchの使い分け基準

if文が適するケース：
- 比較式（大小、不等）や範囲判定が必要なとき
- 複数の条件を論理式で組み合わせたいとき
switch文が適するケース：
- 値が特定の定数に一致するかを判断したいとき
- caseが多く、すべてが同じ変数の値判定であるとき

switchの方が条件が明示的で見通しがよくなる場合がありますが、ifの方が柔軟性は高いです。

4. よくあるミス・誤解・落とし穴

switchでbreakを書き忘れると、意図せず次のcaseに処理が続きます。
対処には、必ず各case内にbreak（またはreturn）を入れるのが基本です。
ifの条件式で代入（=）と比較（===）を混同するミスが頻出します。
条件式に if (x = 1) と書くと、常に1に代入されてtrueとなり、意図しない挙動になります。
switchで複雑な論理条件を記述できないため、値比較以外の分岐はif文にすべきです。
default節を忘れると、未定義の入力に対応できず、バグの温床になります。