1日1%成長するブログ

毎日成長するために仕事/プライベートで得た学びをアウトプットするブログです

JavaScriptのオブジェクトとJSONは別物

JavaScriptのオブジェクトとJSONは見た目がほとんど変わらないので、 違いがよくわかっていなかったのですが、明確に違いがあるようなのでメモしておきます。

JavaScriptのオブジェクト

キーがクォーテーション無し & 文字列をダブルクォーテーションで囲む

{ 
  id: 0,
  title: "title",
  description:  "desc"
}

キーがクォーテーション無し & 文字列をシングルクォーテーションで囲む

{ 
  id: 0,
  title: 'title',
  description:  'desc'
}

キーをクォーテーションで囲むことも出来るけど、囲まない方が推奨。

JSON

キーをダブルクオーテーションで囲み、文字列をダブルクォーテーションで囲むのがJSONJavaScriptのオブジェクトでもある。

{
  "id": 0,
  "title": "title",
  "description":  "desc"
}

JSONのフォーマットとして正しいかどうかは以下のツールを使うと、簡単に判定できるので一度使ってみてください。

lab.syncer.jp

JSON.stringify()とJSON.parse()

JSON.stringifyJavaScriptのオブジェクトをJSON文字列に変換する関数。 JSON.parseJSON文字列をJavaScriptオブジェクトに変換する関数。

出力を見ると、JSON文字列はキーがどちらもダブルクォーテーションで囲まれていることがわかると思います。

var jsVar = {
  id: 1,
  title: "title"
};

var jsonStr = JSON.stringify(jsVar);

var jsParsed = JSON.parse(jsonStr);

console.log(jsVar); // {id: 1, title: "title"}
console.log(jsonStr); // {"id":1,"title":"title"}
console.log(jsParsed); // {id: 1, title: "title"}