JavaScriptの条件分岐（if文・else文）の基本と仕組みを解説！初心者でもわかる使い方

1. if文とは？

1. if文とは？

JavaScriptのif文は、プログラムに「もし〜なら、この処理をしてね」と指示を出すための最も基本的な仕組みです。これを「条件分岐」と呼びます。特定の条件が満たされた（正しいと判定された）ときだけ、指定したコードを実行させることができます。

日常の判断と同じように、プログラムも「数値が一定以上か」「入力があるか」などをチェックして動きます。プログラミング未経験の方でも、まずは「条件を判定して、OKなら中身が動く」というシンプルな流れをイメージすれば大丈夫です。

if文の基本的な書き方

条件は丸かっこ()の中に書き、実行したい処理を波かっこ{}の中に記述します。

// 数値を代入した変数
let appleCount = 15;

// もし appleCount が 10 より大きければ実行
if (appleCount > 10) {
  console.log("リンゴは10個より多いです。");
}

実行結果

リンゴは10個より多いです。

このコードでは、変数appleCountの中身が15なので、「15 > 10」という式が正しいと判断され、メッセージが表示されます。もし変数の値が5だった場合は、条件を満たさないため、波かっこ{}の中の処理は無視され、何も表示されません。

このように、条件によって「やる」か「やらないか」を選べるのがif文の役割です。この仕組みをマスターするだけで、状況に合わせて動きを変える賢いプログラムが作れるようになりますよ。

2. else文とは？

2. else文とは？

if文だけでは、「条件に当てはまったとき」の処理しか作れません。しかし、実際のプログラミングでは「もし条件に当てはまらなかったら、別の動きをさせたい」という場面が非常に多いです。そんなときにセットで使うのがelse文です。

elseは、日本語で「それ以外」や「そうでなければ」という意味になります。ifの条件式がfalse（偽）と判定された瞬間に、elseのブロック内に書かれた処理が自動的に実行されます。これにより、「AかBか」という2パターンの分かれ道を作ることができるようになります。

else文を使ったサンプルコード

例えば、持っているお金が足りるかどうかを判定するプログラムを見てみましょう。

// 持っているお金
let myMoney = 800;

// もし 1000円以上持っていれば
if (myMoney >= 1000) {
  console.log("商品を購入できます！");
} else {
  // 1000円未満（それ以外）の場合に実行される
  console.log("お金が足りません。貯金しましょう。");
}

実行結果

お金が足りません。貯金しましょう。

このコードでは、変数myMoneyが800なので、ifの条件（1000以上）を満たしません。その結果、プログラムは「それ以外」を担当するelseの中身へと進みます。もし、myMoneyを1200に書き換えて実行すれば、今度はifの中身だけが動き、elseの中身は無視されます。

このように、ifとelseを組み合わせることで、ユーザーの入力や状況に合わせた柔軟なレスポンスを返せるようになります。条件分岐の基本形として、セットで覚えておくと非常に便利です。

3. else if文で複数の条件を判定する

3. else if文で複数の条件を判定する

さらに、いくつかの条件を順番に判定したいときは、else ifを使います。これは「もし最初の条件じゃなかったら、次の条件を調べる」という意味です。

例を見てみましょう。

let score = 75;

if (score >= 90) {
  console.log("成績はAです");
} else if (score >= 70) {
  console.log("成績はBです");
} else {
  console.log("成績はC以下です");
}

この例では、点数によって成績を判定しています。scoreが90以上ならA、70以上ならB、それ以外はC以下と判断します。

4. 条件式の基本：trueとfalseとは？

4. 条件式の基本：trueとfalseとは？

条件式とは「判断するための式」のことです。結果はtrue（真）かfalse（偽）になります。

例えば、num > 10という式は、numが10より大きければtrue、そうでなければfalseです。

プログラミングでtrueは「正しい」、falseは「間違い」の意味で使います。

5. よく使う比較演算子

5. よく使う比較演算子

条件式で使う記号（比較演算子）を覚えましょう。主なものは次の通りです。

• == または === ：「等しい」ことをチェック
• != または !== ：「等しくない」ことをチェック
• > ：より大きい
• < ：より小さい
• >= ：以上（大きいか等しい）
• <= ：以下（小さいか等しい）

===と==の違いは少し専門的ですが、簡単に言うと===は値と型の両方をチェックし、==は値だけをチェックします。初心者は===を使うのが安全です。

6. 論理演算子で条件を組み合わせる

6. 論理演算子で条件を組み合わせる

複数の条件を組み合わせて、より複雑な判断もできます。代表的な論理演算子は以下です。

• && ：両方の条件がtrueならtrue（AND条件）
• || ：どちらか一方の条件がtrueならtrue（OR条件）
• ! ：条件の結果を反転する（NOT条件）

例えば、「数値が10以上かつ20以下」という条件はこう書きます。

let num = 15;

if (num >= 10 && num <= 20) {
  console.log("numは10以上20以下です");
}

7. if文の中にif文を書く（ネスト）

7. if文の中にif文を書く（ネスト）

条件の中でさらに条件をチェックしたいときは、if文の中にif文を入れられます。これを「ネスト」と言います。

let age = 20;
let hasTicket = true;

if (age >= 18) {
  if (hasTicket) {
    console.log("入場できます");
  } else {
    console.log("チケットが必要です");
  }
} else {
  console.log("18歳未満は入場できません");
}

この例では、「18歳以上かどうか」をまず判定し、その中で「チケットを持っているかどうか」をさらに判定しています。

8. 実際に使ってみよう！簡単な判定プログラム

8. 実際に使ってみよう！簡単な判定プログラム

最後に、ユーザーから入力された数値を判定する簡単な例を紹介します。実際に動かしてみて動きを理解しましょう。

const input = prompt("好きな数字を入力してください");
const num = Number(input);

if (num > 0) {
  console.log("入力された数字は正の数です");
} else if (num === 0) {
  console.log("入力された数字は0です");
} else if (num < 0) {
  console.log("入力された数字は負の数です");
} else {
  console.log("数字ではない入力です");
}

このプログラムは、数字が正か、0か、負か、数字以外かを判定して結果を表示します。

まとめ

まとめ

今回はJavaScriptの条件分岐であるif文とelse文さらにelse if文の基本から応用までを丁寧に確認しました。条件分岐はプログラミングの中でも非常に重要な基礎であり初心者が最初にしっかり理解しておくべきポイントです。JavaScriptのif文は条件式がtrueのときに処理を実行しfalseのときには処理をスキップするという単純な仕組みですがこの考え方を理解することでさまざまなプログラムが書けるようになります。 またelse文を使うことで条件に当てはまらない場合の処理も明確に書くことができプログラムの流れがより分かりやすくなります。さらにelse if文を使えば複数の条件を順番に判定できるため実務でもよく使われる重要な書き方となります。例えば点数による評価判定やユーザーの入力内容による分岐処理など現実的な場面でも頻繁に利用されます。 条件式ではtrueとfalseという概念が非常に重要です。比較演算子を使って値を比較しその結果が真か偽かで処理を切り替えます。特にJavaScriptでは厳密比較である三重イコールを使うことで型も含めて正確に比較できるため初心者のうちは三重イコールを使う習慣を身につけることが大切です。 さらに論理演算子を使うことで複数の条件を組み合わせることができます。アンド条件やオア条件を理解することでより柔軟で実用的な条件分岐が書けるようになります。例えば年齢とチケットの有無を同時に確認するような処理は実際のアプリケーションでもよく登場します。 if文のネストも重要な考え方です。条件の中にさらに条件を入れることでより細かい判断ができるようになります。ただしネストが深くなりすぎるとコードが読みにくくなるため適度に整理することも大切です。 最後に紹介したサンプルプログラムのようにユーザー入力を判定する処理はJavaScriptの学習において非常に良い練習になります。自分で条件を変えて試してみることで理解が一気に深まります。条件分岐は繰り返しや関数と組み合わせることでさらに強力なプログラムを作ることができるためここでしっかり基礎を固めておきましょう。 JavaScriptのif文やelse文は初心者でも理解しやすい一方で奥が深く実務でも頻繁に使われる重要な技術です。今回学んだ内容を繰り返し実践しながら自分の中で確実に理解していくことがスキルアップへの近道です。

サンプルプログラムで復習

let score = 85;

if (score >= 90) {
  console.log("評価はとても良いです");
} else if (score >= 70) {
  console.log("評価は良いです");
} else if (score >= 50) {
  console.log("評価は普通です");
} else {
  console.log("評価はもう少し頑張りましょう");
}

実行結果

評価は良いです