【JS応用|初心者向け】JavaScriptの比較演算子「Object.is」を使いこなそう!「==」や「===」との違いを徹底解説

1. 導入: なぜObject.isが必要なのか?

JavaScriptで値を比較する際、普段は「==」や「===」を使っている方が多いはずです。しかし、これらには「NaN(非数)同士の比較」や「プラスとマイナスのゼロの区別」において、直感とは異なる結果を返すという弱点があります。
「Object.is」は、そうした例外的なケースでも正確に値を比較するためのメソッドです。プログラムのバグを防ぎ、より厳密な比較を行いたい場合に非常に役立ちます。

2. 基礎知識: 比較演算子の仕組み

JavaScriptには主に3つの比較方法があります。
・「==(等価演算子)」: 型が違う場合、自動的に変換してから比較します。予期せぬ挙動が多いため、現在は使用を避けるのが一般的です。
・「===(厳密等価演算子)」: 型と値の両方が一致しているかを比較します。基本的にはこれで十分ですが、NaNやゼロの扱いに癖があります。
・「Object.is」: ES6(ECMAScript 2015)で導入されました。「===」に近いですが、NaNやゼロの比較において、より数学的な厳密さを追求したメソッドです。

3. 実装/解決策: 使い方のルール

Object.is(値1, 値2) という形式で記述します。結果は true か false で返されます。
最大の特徴は、以下の2点です。
・NaN同士を比較すると true になる(===では false になる)。
・+0 と -0 を区別する(===では true になる)。

4. サンプルプログラム: 動作を確認してみよう

以下のコードをブラウザのコンソールや、Node.js環境で実行してみてください。

// NaNの比較
console.log(NaN === NaN);     // 結果: false (直感に反する)
console.log(Object.is(NaN, NaN)); // 結果: true (正しく同じ値と判定される)

// ゼロの比較
console.log(+0 === -0);       // 結果: true
console.log(Object.is(+0, -0));   // 結果: false (プラスとマイナスは別物と判定される)

// オブジェクトの比較(参照先が同じかどうか)
const obj = { id: 1 };
console.log(Object.is(obj, obj)); // 結果: true
console.log(Object.is({ id: 1 }, { id: 1 })); // 結果: false (中身は同じでも別メモリのオブジェクトなのでfalse)

5. 応用・注意点: 現場での使い分け

「Object.is」は非常に強力ですが、全ての比較をこれで書く必要はありません。
日常的な値のチェック(数値や文字列の一致確認など)には、慣れ親しんだ「===」を使うのが効率的です。
「Object.is」は、以下のようなケースで特に真価を発揮します。
・計算結果が NaN になっていないかを厳密に判定したいとき。
・物理演算やグラフィックス処理などで、ゼロの符号(+0か-0か)が重要な意味を持つとき。
・Reactなどのライブラリ内部で、前回のStateと今回のStateが変更されたかを判定する(メモ化のロジックなど)際に内部的に活用されています。

基本的には「===」を使い、NaNの扱いに困ったときに「Object.is」を思い出すようにしましょう!

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