else if を一言でいうと
else if は、
「if がダメだったときに、別の条件を順番に試していくためのもの」 です。
日本語にすると、
もし 条件A なら A の処理
そうでなくて、もし 条件B なら B の処理
それでもなければ 条件C の処理…
という、“上から順にチェックする複数条件” を書くための仕組みです。
ここが重要です。else if を使うときは、
「どの順番で条件を試すか」「どこで打ち止めにするか」が動作に直結します。
ただ増やすのではなく、「順番」を常に意識してください。
else if の基本構造と流れ
if / else と何が違う?
まず、if / else だけのパターンを思い出します。
if (条件A) {
// 条件Aがtrueのときだけ
} else {
// 条件Aがfalseのときだけ(A以外全部)
}
JavaScriptこれは「2 択」です。
「A か、それ以外か」です。
ここに「B という別パターン」も追加したいときに、else if が登場します。
if (条件A) {
// 条件Aがtrueのとき
} else if (条件B) {
// 条件Aはfalse、かつ 条件Bがtrueのとき
} else {
// 条件AもBもfalseのとき(どれにも当てはまらないとき)
}
JavaScriptelse if の評価順
次のコードを例に、流れを追ってみます。
const score = 82;
if (score >= 90) {
console.log("評価 A");
} else if (score >= 70) {
console.log("評価 B");
} else {
console.log("評価 C");
}
JavaScript実際にはこういう順番で動きます。
score >= 90を評価(82 >= 90 → false)- false なので、その if ブロックはスキップ
- 次に
else if (score >= 70)を評価(82 >= 70 → true) - true なので、そのブロックを実行し、「評価 B」を表示
- どこかで true になった時点で、「以降の else if / else は全部スキップ」
つまり、上から順に「一番最初にマッチした条件だけ」が実行されます。
ここが重要です。else if は「全部の条件を評価してマッチしたところを全部実行する」のではなく、
「上から順に見て最初に当たったところで止める」 ものです。
ここを勘違いすると、「全部チェックしているつもりで、実は上だけしか効いていない」状態になります。
else if で「ランク分け」してみる
典型例:点数による評価
成績を複数段階に分けてみます。
ルールはこうします。
- 90 以上 → A
- 70 以上 → B
- 50 以上 → C
- それ未満 → D
これをコードにすると:
const score = 76;
if (score >= 90) {
console.log("評価 A");
} else if (score >= 70) {
console.log("評価 B");
} else if (score >= 50) {
console.log("評価 C");
} else {
console.log("評価 D");
}
JavaScript流れを丁寧に追うと:
score = 76 の場合
score >= 90→ false- 次の
score >= 70→ true → 「評価 B」で終了 - 「評価 C」や「評価 D」には進まない
score = 52 の場合
score >= 90→ falsescore >= 70→ falsescore >= 50→ true → 「評価 C」で終了
score = 40 の場合
score >= 90→ falsescore >= 70→ falsescore >= 50→ false- どれも当てはまらないので、最後の
else→ 「評価 D」
ここが重要です。
else if を使うときは、「どんな点数が、どの条件に引っかかって、どの時点で分岐が終わるか」を、自分の頭でトレースできることが大事です。
1 つ 1 つの条件だけでなく、「この順番で評価される」という視点を持ってください。
条件の「順番」が結果を変える
間違えやすい悪い例
さきほどの評価を、もし次のように書いてしまったらどうなるでしょう。
const score = 95;
if (score >= 50) {
console.log("評価 C");
} else if (score >= 70) {
console.log("評価 B");
} else if (score >= 90) {
console.log("評価 A");
}
JavaScript95 点なので、本当は「評価 A」にしたいはずです。
しかし、このコードは「評価 C」を表示します。
理由は簡単で、
- 最初の
score >= 50が true になってしまう - 一番上で true になったので、そこで処理が終了
- 以降の
else ifは評価さえされない
からです。
どう並べるのが正解か
「A → B → C → D」のようなランク分けをしたいときは、
必ず「厳しい条件から順」に書くのが鉄則です。
つまり、
if (score >= 90) {
// A
} else if (score >= 70) {
// B
} else if (score >= 50) {
// C
} else {
// D
}
JavaScriptという順番です。
ここが重要です。
else if は「条件の集合」ではなく「条件の“列”」です。
どの条件からチェックするか(順番)を間違えると、
条件式自体は合っていても、全体としては期待と違う動きになります。
「上から読んで気持ちいい順番になっているか?」を常に自分に問いかけてください。
else if を使うときの書き分けイメージ
2 択のときは else だけで十分
条件が「A か A 以外か」の 2 パターンしかないなら、else if は不要で、if / else で十分です。
const age = 20;
if (age >= 18) {
console.log("大人です");
} else {
console.log("未成年です");
}
JavaScriptこれは、
- 18 歳以上 → 大人
- それ以外 → 未成年
と 2 つしかないので、else if を使う意味がありません。
3 パターン以上になったら else if を検討
条件が 3 つ以上に増えたら、else if の出番です。
例えば年齢区分を
- 0〜12 → 子ども
- 13〜19 → ティーン
- 20〜64 → 大人
- 65 以上 → シニア
に分けたいなら、こうです。
const age = 25;
if (age <= 12) {
console.log("子ども");
} else if (age <= 19) {
console.log("ティーン");
} else if (age <= 64) {
console.log("大人");
} else {
console.log("シニア");
}
JavaScriptここでも「範囲が狭い順」または「具体的な条件から順」に並べると、
自然な読み方になります。
ここが重要です。
「場合分けが 3 パターン以上になってきたら、else if を使うタイミング」と覚えておくと良いです。
逆に言うと、2 パターンしかないのに else if を使い始めたら、
いったん落ち着いて「これは本当に 3 パターン必要か?」と見直してみてください。
else if が増えすぎたときのサイン
ネストが深くて読みにくくなっていないか
実務をしていると、そのうちこんなコードを見かけます。
if (type === "guest") {
// ...
} else if (type === "user") {
// ...
} else if (type === "admin") {
// ...
} else if (type === "super-admin") {
// ...
} else {
// ...
}
JavaScriptこれくらいならまだ読めますが、
もっと条件や中身が長くなってくると、一気に読みにくくなります。
そうなってきたら、
switch文に切り替えを検討する- 条件ごとの処理を関数に切り出す
- 「この区分け自体が妥当か?」を見直す
など、「else if を増やし続けない工夫」 が必要になってきます。
とはいえ、最初は else if で十分
ただ、学び始めの段階では、
いきなり switch や高度なパターンに手を出す必要はありません。
まずは
if / else if / elseで頭の中の「場合分け」を表現できる- 条件の順番を意識して書ける
- 「この値ならどのブロックに入るか」を説明できる
ここまでできれば十分です。
ここが重要です。
else if を「最終形」とは思わないこと。
「まず else if で考えてみて、複雑になってきたら別の表現を検討する」くらいの距離感がちょうどいいです。
初心者として else if で本当に押さえてほしいこと
else if は、「if がダメだったときに、別の条件を順番に試す」ためのもの。
処理は上から順に評価され、最初に true になったブロックだけ が実行され、そこで打ち止め。
「厳しい条件(上位ランク)」から順に書き、
「ゆるい条件(下位ランク)」を後ろに回す。
順番を間違えると、意図しないブロックで止まってしまう。
2 パターンしかないときは if / else で十分。
3 パターン以上になったときに、else if の出番がやってくる。
else if が増えすぎて読みにくくなってきたら、
「条件の整理」や「別の構文(switch)」への分離を考え始めるサイン。
ここが重要です。
else if は、“プログラムに「段階的な判断」をさせる道具” です。
「この条件なら A、それがダメなら B、それもダメなら C…」という自分の頭の中のロジックを、
一度日本語にしてから、上から順に if / else if / else に落とし込んでみてください。
そのプロセス自体が、「条件分岐を設計する力」を確実に鍛えてくれます。
最後に、練習問題をいくつか挙げておきます。
自分で条件を言葉で書き出してから、コードにしてみてください。
// 練習1:
// 年齢 age によって、
// 0〜5歳 → "幼児"
// 6〜12歳 → "子ども"
// 13〜18歳 → "ティーン"
// それ以上 → "大人"
// を表示する if / else if / else を書いてみる。
// 練習2:
// 温度 temp によって、
// 30度以上 → "暑い"
// 20度以上30度未満 → "ちょうどいい"
// 10度以上20度未満 → "肌寒い"
// それ未満 → "寒い"
// を表示するコードを書いてみる。
// どの順番で条件を書くのが自然か、自分で考えて決める。
// 練習3:
// 文字列 role が "admin" / "editor" / "viewer" のどれかによって、
// それぞれ違うメッセージを表示し、
// どれにも当てはまらないときは「不明な権限」と表示するコードを書いてみる。
JavaScript「この値のとき、どのブロックが実行される?」を自分で説明できるようになったとき、
あなたは else if をもう “感覚で” 使いこなせているはずです。
