JavaScript | 基礎構文:比較・論理 – 比較演算子(> < == ===)

JavaScript JavaScript
スポンサーリンク

比較演算子の基本と「真偽値」

比較演算子は、2つの値を比べて「真(true)か偽(false)か」を返す演算子です。大小比較(> <)と等価比較(== ===)があり、条件分岐(if)やフィルタ処理に使われます。結果は必ず真偽値になり、さらに組み合わせて複雑な条件を作れます。

console.log(5 > 3);   // true
console.log(5 < 3);   // false
console.log(5 === 5); // true
console.log(5 == "5");// true(後述:型が違っても等しくなることがある)
JavaScript

大小比較(> と <)の振る舞い

数値の比較

数値同士なら直感通りに比較できます。等号を含めたいときは >=, <= を使います。

console.log(10 > 7);   // true
console.log(10 < 7);   // false
console.log(10 >= 10); // true
console.log(10 <= 9);  // false
JavaScript

文字列の比較(辞書順)

文字列は「辞書順(Unicodeのコードポイント順)」で比較されます。数字文字列は数値ではなく文字列として比べると直感と違う結果になることがあります。

console.log("apple" < "banana"); // true(a は b より前)
console.log("2" < "10");         // false("2" は "1" より後 → 文字の並びで判断)
JavaScript

数値として比較したいなら、先に数値へ変換します。

console.log(Number("2") < Number("10")); // true
JavaScript

NaN や undefined の比較

NaN(数値ではない)は、大小比較も常に false になります。undefined は数値比較に向きません。こうした値は事前にチェックするのが安全です。

console.log(NaN > 0);     // false
console.log(NaN < 0);     // false
console.log(NaN === NaN); // false(等価比較でも後述の例外)
JavaScript

等価比較(== と ===)の違い

厳密等価(===)が基本

=== は「値と型の両方が同じか」を判定します。暗黙の型変換を行わないため、予期せぬ一致が起きません。まずはこちらを使うのが基本です。

console.log(1 === 1);   // true
console.log(1 === "1"); // false(型が違う)
console.log(true === 1);// false
JavaScript

緩い等価(==)は型変換が入る

== は比較前に「片方をもう片方に近い型へ」自動変換します。便利な場面もありますが、誤判定の原因になりやすいので注意が必要です。

console.log(1 == "1");   // true(文字列 "1" を数値 1 に変換)
console.log(false == 0); // true
console.log("" == 0);    // true(空文字が 0 に)
console.log(null == undefined); // true(特別扱い)
JavaScript

こうした予期しない一致を避けるため、等価比較は原則として === を使い、必要なときだけ明示的に型変換してから比較します。

const a = "42";
console.log(Number(a) === 42); // true(自分で数値化してから比較)
JavaScript

例外と注意点(初心者がハマりがちなところ)

NaN は何と比べても等しくない

NaN は自分自身とも等しくありません。判定には Number.isNaN を使います。

console.log(NaN === NaN);           // false
console.log(Number.isNaN(NaN));     // true
console.log(Number.isNaN("foo"));   // false(値そのものは NaN ではない)
JavaScript

0 と -0、Object.is の話

JavaScript には -0 という値があり、=== では 0 と -0 は等しい扱いになります。厳密な同一性を取りたいときは Object.is を使います。

console.log(0 === -0);           // true
console.log(Object.is(0, -0));   // false(区別される)
console.log(Object.is(NaN, NaN)); // true(=== では false になる NaN も区別可能)
JavaScript

オブジェクトや配列の比較は「中身」ではなく「参照」

=== でオブジェクトを比べると「同じもの(同じ参照)か」を判定します。見た目が同じでも別インスタンスなら false です。

const a = { x: 1 };
const b = { x: 1 };
const c = a;
console.log(a === b); // false(別インスタンス)
console.log(a === c); // true(同じ参照)
JavaScript

中身を比較したい場合は、キーと値を個別に比べるか、JSON.stringify を使うなど別の方法を選びます(厳密な比較には専用の関数が必要です)。


実用例で理解する

年齢判定(>= を使う)

const age = 18;
console.log(age >= 18); // true(成年判定)
JavaScript

入力値の厳密比較(=== 推奨)

const answer = "yes";
console.log(answer === "yes"); // true
console.log(answer === "YES"); // false(大小文字も違えば不一致)
JavaScript

大小文字を無視したいなら、同じ方向に揃えてから比較します。

console.log(answer.toLowerCase() === "yes"); // true
JavaScript

文字列数値の安全な比較

const left = "10";
const right = "2";
console.log(left > right);                 // false(文字列の辞書順)
console.log(Number(left) > Number(right)); // true(数値比較に変換してから)
JavaScript

null / undefined の存在チェック

const value = undefined;
console.log(value == null);  // true(どちらかなら真)
console.log(value === null); // false(型まで一致させると不一致)
console.log(value === undefined); // true
JavaScript

まとめと指針

比較はまず「数値なら数値へ、文字列なら文字列へ」と型を揃えてから、厳密等価の === を使うのが基本です。大小比較は辞書順の落とし穴を避けるため、数値として比べたい場合は事前に Number で変換します。NaN・-0・オブジェクト参照の挙動は例外的でバグの原因になりやすいので、必要なときにだけ正しく扱えるよう覚えておくと安心です。

タイトルとURLをコピーしました