當前位置:
首頁 >
前端技术
> javascript
>内容正文
javascript
075_JSON.parse()
生活随笔
收集整理的這篇文章主要介紹了
075_JSON.parse()
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
1. JSON的常規用途是同web服務器進行數據傳輸。
2. 在從web服務器接收數據時, 數據永遠是字符串。
3. 通過JSON.parse()解析數據, 這些數據會成為JavaScript對象。
4. 實例 – 解析 JSON
4.1. 請想象一下我們從web服務器接收到這段文本:
'{"name": "華為p40", "price": 5999, "color": ["黑色", "白色", "藍色"], "baseInfo": {"machineLength": "148.9mm", "machineThickness": "71.06mm"}}''["華為手機", "小米手機", "vivo手機", "oppo手機", "魅族手機"]'4.2. 請使用JavaScript函數JSON.parse()把文本轉換為JavaScript對象:
var mobile = '{"name": "華為p40", "price": 5999, "color": ["黑色", "白色", "藍色"], "baseInfo": {"machineLength": "148.9mm", "machineThickness": "71.06mm"}}';var mobileArr = '["華為手機", "小米手機", "vivo手機", "oppo手機", "魅族手機"]';5. 解析日期
5.1. JSON中不允許日期對象。
5.2. 如果您需要包含日期, 請寫為字符串, 之后您可以將其轉換回日期對象。
5.3. 可以已使用JSON.parse()函數的第二個參數, 被稱為reviver。這個reviver參數是函數, 在返回值之前, 它會檢查每個屬性。
var computer = '{"name": "聯想電腦", "date": "2021-10-10 23:00:01"}'; var computerObj = JSON.parse(computer, function(key, value){if(key == "date"){return new Date(value).toLocaleString();}else{return value;} });6. 例子
6.1. 代碼
<!DOCTYPE html> <html><head><meta charset="utf-8" /><title>JSON.parse()</title></head><body><script type="text/javascript">function bianLi(obj) {for(let key in obj) {if(obj[key] instanceof Object && !(obj[key] instanceof Array)){bianLi(obj[key]);continue;}document.write(key + ': ' + obj[key] + '<br />');}}var mobile = '{"name": "華為p40", "price": 5999, "color": ["黑色", "白色", "藍色"], "baseInfo": {"machineLength": "148.9mm", "machineThickness": "71.06mm"}}';var mobileObj = JSON.parse(mobile);bianLi(mobileObj);var mobileArr = '["華為手機", "小米手機", "vivo手機", "oppo手機", "魅族手機"]';var mobileArrObj = JSON.parse(mobileArr);for(let key in mobileArrObj) {document.write(mobileArrObj[key] + '<br />');}var computer = '{"name": "聯想電腦", "date": "2021-10-10 23:00:01"}';var computerObj = JSON.parse(computer, function(key, value){if(key == "date"){return new Date(value).toLocaleString();}else{return value;}});bianLi(computerObj);</script></body> </html>6.2. 效果圖
總結
以上是生活随笔為你收集整理的075_JSON.parse()的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 074_JSON.stringify()
- 下一篇: 084_html DOM