JavaScriptの関係演算子をやさしく理解する
はじめての人に向けて、「値を比べる」ってどうやるの？を、例題つきで丁寧に説明します。ポイントは「比較すると、結果は true（正しい）か false（正しくない）のどちらかになる」です。
よく使う4つの比較記号
- 小なり
<: 左が右より小さいときに true - 以下
<=: 左が右以下（小さいか同じ）なら true - 大なり
>: 左が右より大きいときに true - 以上
>=: 左が右以上（大きいか同じ）なら true
console.log(5 < 7); // true
console.log(8 <= 8); // true
console.log(10 > 12); // false
console.log(10 >= 7); // true
条件分岐での使いどころ
- if文で合否や分岐を決めるときに使います。
let score = 78;
if (score >= 70) {
console.log("合格");
} else {
console.log("不合格");
}
- for文でループ回数を制御するときにも使います。
for (let i = 0; i < 3; i++) {
console.log("繰り返し：" + i);
}
// i が 0,1,2 の間だけ実行（i < 3 が条件）
数値どうしの比較はシンプル
- Label: 結果は直感どおり
- Label: 計算式の結果も比較できる
console.log(3 + 4 > 5); // true（7 > 5）
console.log(10 / 2 <= 4); // false（5 <= 4 は false）
文字列の比較は「辞書順」
- Label: 文字列は「文字コード（辞書順）」で比べる
- Label: 大文字と小文字は別物（一般に ‘A’ < ‘a’）
console.log("apple" < "banana"); // true（a は b より前）
console.log("Zoo" < "apple"); // true（Z は a より前の文字コード）
console.log("10" < "2"); // true（文字列同士は先頭文字で比べる：'1' < '2'）
- 直感とズレやすいポイントは「数字っぽい文字列でも、文字列同士なら数値としては比べない」こと。
数値と文字列を比べるときの自動変換
- Label: 文字列が数値として読めるなら、数値に変換して比較
- Label: 数値にできない文字列は NaN 扱いで比較は false になりやすい
console.log("120" > 3); // true（"120" → 120）
console.log("007" >= 7); // true（"007" → 7）
console.log("flower" > 3); // false（数値にできず比較不可）
- 初心者向けのコツ：迷ったら、先に Number() で明示的に変換してから比較すると安全。
console.log(Number("10") > Number("2")); // false（10 > 2 は true → あ、文字列比較の勘違い防止に役立つ）
true/false、null、undefined の比較のクセ
- Label: true は 1、false は 0 として数値比較される
- Label: null は 0 として比較されることがある
- Label: undefined は数値変換できない（NaN）ため比較が false になりがち
console.log(true > false); // true（1 > 0）
console.log(null >= 0); // true（0 >= 0）
console.log(undefined > 0); // false（NaN と 0 の比較は成立しない）
- これらはバグのもと。型が混ざる比較は避けるか、明示的に型変換してから比較しましょう。
よくある落とし穴と回避策
- Label: “10” と 2 の比較
console.log("10" > 2); // true（"10" が数値 10 に変換される）
console.log("10" < "2"); // true（文字列同士なら '1' < '2'）
- 回避策: 文字列か数値かを意識して、必要なら Number() で変換してから比較。
- Label: 大文字と小文字の違い
console.log("a" > "Z"); // true（小文字は一般に大文字より後）
- 回避策: 大小を気にしない比較をしたいなら、両方を同じケースに揃える。
console.log("Apple".toLowerCase() < "banana".toLowerCase()); // true
ミニ練習問題（答えは下）
問題 1
次の結果は？
"8" > 7"8" < "7"true >= 1null < 1"cat" > "car"
問題 2
身長が 120cm 以上なら「乗れる」、それ未満なら「乗れない」と表示するコードを書いてください。
ヒント: height という変数を使う
ミニ練習問題の答え
問題 1 解答
- 1) true（”8″ → 8）
- 2) false（文字列同士：’8′ は ‘7’ より後）
- 3) true（true → 1、1 >= 1）
- 4) true（null → 0、0 < 1）
- 5) true（”cat” と “car” の 3文字目：’t’ は ‘r’ より後）
問題 2 例解
let height = 118; // 例: ここを変えて試してみよう
if (height >= 120) {
console.log("乗れる");
} else {
console.log("乗れない");
}
まとめのコツ
- 結果は必ず true/false
- 文字列は辞書順、数値はそのまま
- 型が混ざるときは Number() や toLowerCase() などで揃える
- if文・for文での条件は「何を比べているか」を明確に