JavaScriptの条件分岐（if文）：条件によって処理を変える

プログラムに「判断」をさせる仕組みが条件分岐です。今日は、条件によって異なる処理を実行する「if文」を学びました。

if文の基本

構文:

if (条件式) {
  処理
}

const age = 20;

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

ポイント

  • 条件式を () で囲む
  • 処理を {} で囲む
  • セミコロンは不要（if の後に ; は付けない）

条件が成り立てば（true）、{} 内の処理が実行されます。

真偽値：trueとfalse

条件式の結果は、**真偽値（boolean）**で表されます。

  • true: 条件が成り立つ
  • false: 条件が成り立たない
console.log(10 > 5);   // true
console.log(10 < 5);   // false
console.log(10 === 10); // true

比較演算子

条件式では、値を比較する「比較演算子」を使います。

基本的な比較演算子

演算子意味例
>より大きい10 > 5 → true
<より小さい10 < 5 → false
>=以上10 >= 10 → true
<=以下10 <= 5 → false

等価演算子と厳密等価演算子

値が「等しいか」「異なるか」を判定する演算子は2種類あります。

等価演算子（== と !=）

演算子意味例
==等しい5 == '5' → true
!=異なる5 != '5' → false
console.log(5 == '5');   // true（型が違っても等しいと判定）
console.log(5 == 5);     // true

注意点: 等価演算子は、数値と文字列を自動的に変換して比較します。

// 数値の5と文字列の'5'が同じものとして扱われる
console.log(5 == '5');  // true

厳密等価演算子（=== と !==）

演算子意味例
===厳密に等しい5 === '5' → false
!==厳密に異なる5 !== '5' → true
console.log(5 === '5');  // false（型も含めて比較）
console.log(5 === 5);    // true

厳密等価演算子は、型（数値か文字列か）も含めて比較します。

どちらを使うべきか？

実務では === と !== を使うことが推奨されます。

理由：

  • 意図しない型変換によるバグを防げる
  • コードの意図が明確になる
const input = '10';  // ユーザー入力は文字列

// ❌ 等価演算子だと意図しない結果になる
if (input == 10) {
  console.log('10です');  // 実行される（文字列'10'と数値10が等しいと判定）
}

// ✅ 厳密等価演算子で正確に判定
if (input === 10) {
  console.log('10です');  // 実行されない（型が違うので等しくない）
}

else：条件がfalseのときの処理

else を使うと、条件がfalseのときの処理を指定できます。

構文:

if (条件式) {
  条件式がtrueの時の処理
} else {
  条件式がfalseの時の処理
}

const age = 15;

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

else if：条件を追加する

複数の条件を判定したいときは、else if を使います。

構文:

if (条件式1) {
  条件式1がtrueの時の処理
} else if (条件式2) {
  条件式2がtrueの時の処理
} else {
  どの条件もfalseの時の処理
}

const score = 75;

if (score >= 80) {
  console.log('優秀');
} else if (score >= 60) {
  console.log('合格');
} else {
  console.log('不合格');
}
// 合格

論理演算子：複数の条件を組み合わせる

&&（かつ）：すべての条件が成り立つ

const age = 25;
const hasLicense = true;

if (age >= 18 && hasLicense) {
  console.log('運転できます');
}
// 運転できます

||（または）：いずれかの条件が成り立つ

const day = '土曜';

if (day === '土曜' || day === '日曜') {
  console.log('休日です');
}
// 休日です

Pythonとの違い

項目PythonJavaScript
条件式の囲みなし() が必要
ブロックの囲みインデントのみ{} が必要
セミコロン不要文末のみ必要
かつand&&
またはor**`
等価==== または ===

JavaScriptでは**()と{}が必須**という点が大きな違いです。

今日の学びのポイント

  • if文: if (条件式) { 処理 }
  • 真偽値: true（真）と false（偽）
  • 比較演算子: >, <, >=, <=
  • 等価演算子: ==, !=（型を変換して比較）
  • 厳密等価演算子: ===, !==（型も含めて比較）← 推奨
  • else: 条件がfalseのときの処理
  • else if: 条件の追加
  • 論理演算子: &&（かつ）、||（または）

条件分岐は、プログラムに「判断力」を持たせるための基本です。次は、より多くの分岐を扱える「switch文」を学びます。

コメント