[JS奇怪的世界]No.25 JSON與物件實體

發表於 | 更新於 | 分類於

JSON與物件實體

接下來將會講解大家常對 JSON 的錯誤理解，那 JSON是什麼呢?JSON 是 JavaScript Object Notation，它是由 JavaScript 物件實體所啟發產生的，當我們在建立物件實體的時候，其實也就是在建立 JSON ↓

1
2
3
4
5
var objectLiteral = {
 firstname: 'mary',
 isAProgrammer: true,
};
console.log(objectLiteral);

那早期的資料再傳送的格式大概都像這樣 ↓

1
2
3
4
<object>
 <firstname>mary</firstname>
 <isAProgrammer>true</isAProgrammer>
</object>

那這樣子傳送其實當資料越來越多的時候，會有非常嚴重的問題，檔案會太大，因為裡面有太多不需要的符號及多餘的且重複符號這些都會影響速度，所以才會延伸出這樣子的作法 (JSON) ↓

1
2
3
4
{
 firstname: 'mary',
 isAProgrammer: true,
};

那就是因為這個原因導致，所以我們現在都使用 JSON 來接收及傳送資料，但 JSON 格式會稍微有點不太一樣，，首先屬性必須要包在引號內 ↓

1
2
3
4
{
 'firstname': 'mary',
 'isAProgrammer': true,
};

課程上有說明 JSON 在物件實體語法是有效的，但不是所有物件實體語法在 JSON 有效，因為 JSON 是一個比較嚴格的檔案，所以 JSON 並不是 JavaScript 的一部分，但是 JSON 在 JavaScript 裡面非常受歡迎，所以 JavaScript 有兩個語法可以讓它轉換成 JSON 格式及物件(Object)實體語法。

例如將物件實體語法轉換成 JSON，使用 JSON.stringify() ↓

1
2
3
4
5
var objectLiteral = {
 firstname: 'mary',
 isAProgrammer: true,
};
console.log(JSON.stringify(objectLiteral));

JSON.stringify() 就會將物件實體語法的屬性加上引號 ↓

1
'{"firstname": "mary", "isAProgrammer": true}'

JSON stringify

那 JSON 轉換成物件實體語法呢?則是使用 JSON.parse() ↓

1
2
var jsonValue = JSON.parse('{ "firstname": "mary","isAProgrammer": true }');
console.log(jsonValue);

那它就會轉換成這樣 ↓

1
2
3
4
var myValue = {
 firstname: 'mary',
 isAProgrammer: true
};

JSON parse

圖源

JavaScript 全攻略:克服 JS 奇怪的部分

0%