【初心者向け】if/else文の使い方を超わかりやすく解説｜条件分岐の基礎をマスターしよう

プログラミングを始めると必ず出てくるのが if / else（条件分岐） です。
この記事では、初心者でも理解できるように、考え方から実際の書き方、JavaScriptの例、よくあるミス、応用まで徹底的にわかりやすく解説します。

---

1. if / else文とは？（超基本）

if文は「もし ●● なら、▲▲ を実行する」という意味を持つ構文です。
else は「それ以外の場合は ●● を実行する」という補助的な役割。

基本形は以下のとおりです。

if (条件) {
  // 条件がtrueのとき実行
} else {
  // 条件がfalseのとき実行
}

---

2. “条件” とは？

条件とは、最終的に true（真） か false（偽） のどちらかになる式のこと。

例：

• x > 10（xが10より大きいか？）
• isLoggedIn（ログインしているか？ 真偽値）
• score === 100（スコアが100点か？）

---

3. よく使う比較・論理演算子

● 比較演算子

• ==　等しい
• !=　等しくない
• >　大きい
• <　小さい
• >=　以上
• <=　以下
• ===（JS）厳密に等しい（型まで一致）

● 論理演算子

• &&　かつ
• ||　または
• !　否定

---

4. JavaScriptでのif/elseの書き方

const age = 20;

if (age >= 18) {
  console.log('成人です');
} else {
  console.log('未成年です');
}

厳密比較（JavaScript）：

const a = '5';

if (a === 5) {
  console.log('同じ');
} else {
  console.log('違う（文字列と数値は異なる）');
}

---

5. else if（複数の条件分岐）

● JavaScript

const score = 75;

if (score >= 90) {
  console.log('A');
} else if (score >= 70) {
  console.log('B');
} else if (score >= 50) {
  console.log('C');
} else {
  console.log('D');
}

6. 三項演算子（短く書く方法）

● JavaScript

const message = age >= 18 ? '成人' : '未成年';

7. よくあるミスと注意点

● 1. 代入と比較を間違える（JS）

if (x = 5) {  // ←代入！バグの原因
}

比較は == や === を使う。

---

● 2. 波括弧 {} を省略してバグる（JS）

1行でも {} を付けたほうが安全です。

---

● 3. 条件の順番ミス

広い条件を先に書くと細かい条件に到達しません。

---

● 4. JSの truthy / falsy に注意

• 0
• ''（空文字）
• null
• undefined
• NaN

これらは false と扱われる。

---

● 5. 小数の比較は誤差に注意

0.1 + 0.2 === 0.3  // false

---

8. 実用コード例

● 偶数・奇数判定（JavaScript）

const n = 6;

if (n % 2 === 0) {
  console.log('偶数');
} else {
  console.log('奇数');
}

---

---

9. ネスト（入れ子）しすぎ問題の解決策

● ネストが深い例

if (loggedIn) {
  if (hasPermission) {
    doSomething();
  } else {
    showError();
  }
}

● 改善版（早期リターン）

if (!loggedIn) return;
if (!hasPermission) { showError(); return; }

doSomething();

---

10. 練習問題

①
変数 temp が

• 30 以上 →「暑い」
• 20 以上30未満 →「快適」
• それ以外 →「寒い」

と判定するコードを書いてみよう。

②
変数 n が

• 正の偶数
• 正の奇数
• 負の数
• 0

のどれかを判定するコードを書いてみよう。

③
文字列 pw が

• 8文字以上
• 英数字を含む

なら OK、
それ以外は NG。

---

まとめ

• if/elseは「条件で処理を分ける」ための最も基本的な構文。
• JavaScriptは === を使うのが安全。
• 条件の順番やネストに注意。
• 慣れてきたら三項演算子も便利。

その他関連記事はこちら→プログラミング備忘録