1、JSON（JavaScript Object Notation）概述
（1）概念
JSON是一種輕量級的數據交換格式，功能上類似於XML，但是JSON的數據更新更容易解析，更小、速度更快。
JSON是一種完全獨立於編程語言的文本格式（占用空間小，利於傳輸），因此JSON可以運用於不同的語言中。
采用完全獨立於編程語言的文本格式來存儲和表示數據
易於閱讀和編寫，同時也易於機器解析和生成，並有效地提升網絡傳輸效率
數據格式：對象和字符串
（2）前后端分離
后端獨立部署，提供接口，提供數據
前端獨立部署，負責渲染后端的數據
2、JSON對象
{
"pname":"小熊餅干",
"price":12.3,
"paddress":"河南省漯河市",
"ptime":"2020-1-10"
}
（1）一共為product對象創建了四個變量，並為變量進行了賦值。
（2）在創建對象時，數值名稱必須用雙引號，數值是Object類型。
3、JSON數組（多個對象）
[{
"pname":"小熊餅干",
"price":12.3,
"paddress":"河南省漯河市",
"ptime":"2020-1-10"
},
{
"pname":"薯脆",
"price":2.3,
"paddress":"河南省鄭州市",
"ptime":"2020-2-10"
},
{
"pname":"可口可樂",
"price":4.00,
"paddress":"河南省鄭州市",
"ptime":"2020-1-23"
}
]
（1）該數組中包括了三個元素，每個元素代表一個商品的信息，
（2）花括號中的內容是一個對象，方括號中的內容是一個數組。
（3）值的本身也是一個對象：
supermarket={
"productes":[
{
"pname":"小熊餅干",
"price":12.3,
"paddress":"河南省漯河市",
"ptime":"2020-1-10"
},
{
"pname":"薯脆",
"price":2.3,
"paddress":"河南省鄭州市",
"ptime":"2020-2-10"
},
{
"pname":"可口可樂",
"price":4.00,
"paddress":"河南省鄭州市",
"ptime":"2020-1-23"
}
],
"address":"河南省周口市"
}
一個超市有多個商品信息。
4、JSON的取值
（1）從對象中取值：
<script> var product={ "pname":"小熊餅干", "price":12.3, "paddress":"河南省漯河市", "ptime":"2020-1-10" }; alert(product.pname); </script>
（2）從數組中取值：
<script> var products= [{ "pname":"小熊餅干", "price":12.3, "paddress":"河南省漯河市", "ptime":"2020-1-10" }, { "pname":"薯脆", "price":2.3, "paddress":"河南省鄭州市", "ptime":"2020-2-10" }, { "pname":"可口可樂", "price":4.00, "paddress":"河南省鄭州市", "ptime":"2020-1-23" } ]; alert(products[1].pname); </script>
（3）值為對象的時候的取值方法：
<script> var supermarket={ "productes":[ { "pname":"小熊餅干", "price":12.3, "paddress":"河南省漯河市", "ptime":"2020-1-10" }, { "pname":"薯脆", "price":2.3, "paddress":"河南省鄭州市", "ptime":"2020-2-10" }, { "pname":"可口可樂", "price":4.00, "paddress":"河南省鄭州市", "ptime":"2020-1-23" } ], "address":"河南省周口市" }; alert(supermarket.productes[1].pname); </script>
5、修改值
<script> var supermarket={ "productes":[ { "pname":"小熊餅干", "price":12.3, "paddress":"河南省漯河市", "ptime":"2020-1-10" }, { "pname":"薯脆", "price":2.3, "paddress":"河南省鄭州市", "ptime":"2020-2-10" }, { "pname":"可口可樂", "price":4.00, "paddress":"河南省鄭州市", "ptime":"2020-1-23" } ], "address":"河南省周口市" }; supermarket.productes[1].pname="雪碧"; alert(supermarket.productes[1].pname); </script>
6、json對象對象和json字符串的轉換
（1）json對象轉換為json字符串
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> var user={ name:"zhai", age:12, sex:"男" }; var json=JSON.stringify(user); console.log(json); console.log(user); </script> </head> <body> </body> </html>
先創建一個js的user對象，然后調用方法將user對象轉換為json對象
第一個是json對象（是字符串格式，不能展開），第二個是js創建的對象可以展開查看所有的屬性
（2）json字符串轉換為json對象
在網絡中傳輸的json是（服務器向而客戶端傳輸的數據）字符串形式的，將數據返回到前端時，是通過js代碼進行處理的，因此需要進行格式的轉換
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> var user={ name:"zhai", age:12, sex:"男" }; var json=JSON.stringify(user); console.log(json); var obj=JSON.parse(json); console.log(obj); </script> </head> <body> </body> </html>
先調用方法將一個js對象轉化為json對象，再調用方法將json對象轉化為js對象
