JS
条件分岐
初級読み方：じょうけんぶんき｜英語：Conditional
条件によって処理を変えることで、if / else if / else で書くよ。
やさしい説明
条件分岐（じょうけんぶんき）とは、条件によって処理を変える仕組みです。「もし〜なら〜する、そうでなければ〜する」をプログラムで書けます。
信号機に例えると、「青なら渡る、赤なら止まる」が条件分岐です。プログラムも同じように、状況に応じて動作を変えます。
JavaScriptでは if、else if、else を使います。条件が多い場合は switch 文も使えます。
具体例・使い方
const score = 75;
if (score >= 80) {
console.log("優秀！");
} else if (score >= 60) {
console.log("合格！"); // ← score=75なのでここが実行される
} else {
console.log("もう少し頑張ろう");
}実際のWebアプリでよく使うパターン
// ログイン判定
if (isLoggedIn) {
showDashboard();
} else {
redirectToLogin();
}
// フォームのバリデーション
if (email === "") {
showError("メールアドレスを入力してください");
} else if (!email.includes("@")) {
showError("メールアドレスの形式が正しくありません");
} else {
submitForm();
}
// 条件（三項）演算子: 短い条件分岐に便利
const label = isAdmin ? "管理者" : "一般ユーザー";switch文：条件が多いとき
const day = "月";
switch (day) {
case "月":
case "火":
case "水":
case "木":
case "金":
console.log("平日");
break;
case "土":
case "日":
console.log("週末");
break;
default:
console.log("不明な曜日");
}同じ値と比較する条件が3つ以上ある場合は switch 文が読みやすくなります。break を書かないと次のケースに処理が流れてしまうので注意。
いつ使う？
- ログイン判定（ログイン済みなら表示、未ログインならリダイレクト）
- フォームのバリデーション（入力が空・形式が違う場合にエラー表示）
- ゲームの勝敗判定
- 権限による表示切り替え（管理者と一般ユーザーで異なる画面）
- エラーハンドリング（成功・失敗で異なる処理をする）
間違いやすいポイント
❌ = と === を間違える
= は代入、=== は比較です。if文の条件に = を書くと常にtrueになるバグが発生します。
// ❌ = は代入（条件判定ではない！）
if (score = 100) { ... } // scoreに100が代入され常にtrue
// ✅ === で厳密に比較する
if (score === 100) { ... }❌ else if の順番を間違える
条件は上から順に評価されます。広い条件を先に書くと、下の条件に到達しません。「大きい数から順に」書くのが基本です。
よくある疑問
Q: ===と==の違いは？
A: ===は型も比較（厳密比較）、==は型変換してから比較します。1 == '1' はtrue、1 === '1' はfalse。===を使いましょう。
Q: if文以外の条件分岐は？
A: switch文（値の一致で分岐）、三項演算子（条件 ? 真 : 偽）があります。条件が多いときはswitchが読みやすいです。
Q: 条件式でよく使う比較演算子は？
A: ===（等しい）、!==（等しくない）、>（より大きい）、<（より小さい）、>=（以上）、<=（以下）、&&（かつ）、||（または）です。
関連用語
📖 関連レッスン
レッスンを見る →