中級

同じ内容のオブジェクト同士が === でfalseになる理由

オブジェクトや配列の==・===は中身ではなく参照（メモリ上の同一性）を比較します。プロパティの値がすべて同じでも、別々に作られたオブジェクトは等しいと判定されません。

なぜエラーが出ないのか

出力: false

（エラーなし）

JavaScriptは何も報告しません。文法として正しいためです

出力: false

実際の挙動 — 期待した結果と食い違っている箇所

見つけ方

エラーが出ないので、出力を目で確かめるか、コードを目で追うしかありません。この種の誤りが最も発見が遅れます

このエラーが出る典型パターン

 1  const a = { id: 1 };
 2  const b = { id: 1 };
 3  console.log(a === b      );
                      ^

 1  const arr1 = [1, 2, 3];
 2  const arr2 = [1, 2, 3];
 3  console.log(arr1 === arr2                                );
                                      ^

 1  const p1 = { x: 1, y: 2 };
 2  const p2 = { x: 1, y: 2 };
 3  console.log(p1 === p2                     );
                               ^

よくある誤解

「プロパティの値が同じなら等しいはず」という直感は、プリミティブ値（数値・文字列など）には当てはまりますが、オブジェクトには当てはまりません。中身を比較したい場合はプロパティを個別に比較するか、JSON.stringify等で明示的に行う必要があります。

まとめ

同じ内容のオブジェクト同士が === でfalseになる理由は中級でつまずきやすい項目です。上の3パターンを実際に手で直すと、エラーメッセージのどこを読めばよいかが掴めます。

演習をはじめる

関連するエラー

• スプレッド構文{ ...obj }はネストした値までは複製しない（浅いコピー）{ ...obj }や[...arr]は最上位のプロパティだけをコピーします。
• typeof null === 'object' の罠typeof演算子はnullに対して"object"を返します。

他の言語ではどうなるか

• == はなぜ言語によって「参照」と「値」のどちらを比較するのか