連想配列をオブジェクトにするときの処理について

Question

連想配列をオブジェクトにするときの処理として、
下記のような処理を行いました。

const data = [
  {
      id: "1",
      name: "hoge",
      children: [
        { id:"2",name: "fuga"},
        { id:"3",name: "fuafuga" }
      ],
    }, {
      id: "4",
      name: "hogehoge",
      children: [],
    }
]
const hoge = JSON.stringify(data)
const obj = JSON.parse(hoge)
console.log(data === obj)

デベロップツールでdata とobjの値を確認すると、
全く同じ値が入っているように見えるのですが。、
data === obj がfalseとなっております。
これはなぜなのでしょうか？
どなたかご教示いただけませんでしょうか？

Comments

[m.ts10806]

そもそもですが、連想配列もオブジェクト
厳密にはJavaScriptで扱うもの全て、文字列もオブジェクトです。

[takochan1192]

ありがとうございます。そうだったんですね。

[think49]

> 文字列もオブジェクトです。

new StringはObject型ですが、"foo" はObject型ではありません。
Object(arg) === arg で比較すると、判断できます。

Answer 1

オブジェクトに対する===の結果は、オブジェクトが同一のインスタンスかを示すもので、同一の内容を持っているかではありません。

提示されたコードで、dataとobjは異なるインスタンスですから、falseが返ります。

Comments

[takochan1192]

ありがとうございます。なるほどですね。

Answer 2

hoge と obj が指すオブジェクト（インスタンス）が異なるからだと思います。

javascript == === などをキーワードにググってみると参考になる記事が見つかると思います。例えば下記：

比較演算子（「2 つの異なるオブジェクトは、厳密な比較でも抽象的な比較でも等しくなりません」と書いてある）
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/Comparison_Operators

JavaScript 忘れがちな　=== と == の違い - オブジェクト
https://qiita.com/PianoScoreJP/items/e43d70ec188c6fed73ed#%E3%82%AA%E3%83%96%E3%82%B8%E3%82%A7%E3%82%AF%E3%83%88

Comments

[takochan1192]

ありがとうございます。=== と== は違うのを忘れておりました。勉強になりました。

Answer 3

const a=b={hoge:1}
a.hoge=2;
console.log(b);//{hoge:2}
console.log(a===b);//true

Comments

[takochan1192]

ありがとうございます。こうすると、同じ値を参照しているということになるのですね。
勉強になりました。分かり易い例を出していただき本当にありがとうございました。