JSON的parse()方法介紹
parse()方法的介紹:
在接收服務(wù)器數(shù)據(jù)時(shí)一般是字符串。
我們可以使用 JSON.parse() 方法將數(shù)據(jù)轉(zhuǎn)換為 JavaScript 對(duì)象。
語法
JSON.parse(text[, reviver])
參數(shù)說明:
- text:必需, 一個(gè)有效的 JSON 字符串。
- reviver: 可選,一個(gè)轉(zhuǎn)換結(jié)果的函數(shù), 將為對(duì)象的每個(gè)成員調(diào)用此函數(shù)。
下面我們來看一個(gè)實(shí)例:
<p id="demo"></p> <script> var obj = JSON.parse('{ "name":jb51", "alexa":10000, "site":www.dbjr.com.cn }'); document.getElementById("demo").innerHTML = obj.name + ":" + obj.site; </script>
首先通過parse()方法將JSON數(shù)據(jù)轉(zhuǎn)換為JavaScript對(duì)象,
解析完成后,我們就可以在網(wǎng)頁上使用JSON數(shù)據(jù)了
從服務(wù)端接收 JSON 數(shù)據(jù)(數(shù)組JSON數(shù)據(jù))
我們可以使用 AJAX 從服務(wù)器請(qǐng)求 JSON 數(shù)據(jù),并解析為 JavaScript 對(duì)象。
eg: var xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { myObj = JSON.parse(this.responseText); document.getElementById("demo").innerHTML = myObj.name; } }; xmlhttp.open("GET", "/try/ajax/json_demo.txt", true); xmlhttp.send();
json_demo.txt服務(wù)端數(shù)據(jù)需要自個(gè)編寫。
JSON中有個(gè)異常解析數(shù)據(jù)
JSON 不能存儲(chǔ) Date 對(duì)象。如果你需要存儲(chǔ) Date 對(duì)象,需要將其轉(zhuǎn)換為字符串。之后再將字符串轉(zhuǎn)換為 Date 對(duì)象。
<p id="demo"></p> <script> //將字符串轉(zhuǎn)換為data對(duì)象 var text = '{ "name":"csdn", "initDate":"2018-12-14", "site":www.dbjr.com.cn}'; var obj = JSON.parse(text); obj.initDate = new Date(obj.initDate); document.getElementById("demo").innerHTML = obj.name + "創(chuàng)建日期: " + obj.initDate; </script>
這時(shí)我們可以啟用JSON的第二個(gè)參數(shù):
<p id="demo"></p> <script> var text = '{ "name":"csdn", "initDate":"2018-12-14", "site":"www.dbjr.com.cn"}'; var obj = JSON.parse(text, function (key, value) { if (key == "initDate") { return new Date(value); } else { return value; }}); document.getElementById("demo").innerHTML = obj.name + "創(chuàng)建日期:" + obj.initDate;
解析函數(shù):
JSON 不允許包含函數(shù),但你可以將函數(shù)作為字符串存儲(chǔ),之后再將字符串轉(zhuǎn)換為函數(shù)。
var text = '{ "name":"jb51", "alexa":"function () { return 10000;}", "site":"www.dbjr.com.cn"}'; var obj = JSON.parse(text); obj.alexa = eval("(" + obj.alexa + ")"); 注意:最好不要在json中使用函數(shù) document.getElementById("demo").innerHTML = obj.name + " Alexa 排名:" + obj.alexa();
總結(jié)
以上就是這篇文章的全部?jī)?nèi)容了,希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,謝謝大家對(duì)腳本之家的支持。如果你想了解更多相關(guān)內(nèi)容請(qǐng)查看下面相關(guān)鏈接
- jQuery.parseJSON()函數(shù)詳解
- Vue.js實(shí)現(xiàn)開發(fā)購物車功能的方法詳解
- Python常用的json標(biāo)準(zhǔn)庫
- JS異步執(zhí)行結(jié)果獲取的3種解決方式
- JavaScript中.min.js和.js文件的區(qū)別講解
- 對(duì)pandas處理json數(shù)據(jù)的方法詳解
- JSON.stringify()方法講解
- JS實(shí)現(xiàn)的點(diǎn)擊按鈕圖片上下滾動(dòng)效果示例
- js中innerText/textContent和innerHTML與target和currentTarget的區(qū)別
- Javascript刪除數(shù)組里的某個(gè)元素
相關(guān)文章
原生Javascript/原生JS修改CSS樣式的4種方式簡(jiǎn)單示例
在網(wǎng)頁開發(fā)中我們經(jīng)常會(huì)用到JavaScript來操作網(wǎng)頁元素,其中一個(gè)常見的操作就是修改元素的CSS樣式,下面這篇文章主要給大家介紹了關(guān)于原生Javascript/原生JS修改CSS樣式的4種方式,需要的朋友可以參考下2024-03-03javascript實(shí)現(xiàn)按回車鍵切換焦點(diǎn)
這篇文章主要介紹了javascript實(shí)現(xiàn)按回車鍵切換焦點(diǎn)的方法,需要的朋友可以參考下2015-02-02JavaScript數(shù)組函數(shù)unshift、shift、pop、push使用實(shí)例
這篇文章主要介紹了JavaScript數(shù)組函數(shù)unshift、shift、pop、push使用實(shí)例,本文先是講解了聲明數(shù)組的方法,然后對(duì)4個(gè)函數(shù)使用給出了一些例子,需要的朋友可以參考下2014-08-08原生JavaScript實(shí)現(xiàn)模態(tài)框的示例代碼
這篇文章主要為大家詳細(xì)介紹了如何利用原生JavaScript封裝實(shí)現(xiàn)模態(tài)框效果,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-06-06mock.js實(shí)現(xiàn)模擬生成假數(shù)據(jù)功能示例
這篇文章主要介紹了mock.js實(shí)現(xiàn)模擬生成假數(shù)據(jù)功能,結(jié)合實(shí)例形式分析了mock.js插件生成模擬數(shù)據(jù)的相關(guān)操作技巧,需要的朋友可以參考下2019-01-01httpclient模擬登陸具體實(shí)現(xiàn)(使用js設(shè)置cookie)
最簡(jiǎn)單的方法就是通過得到的cookie定制一個(gè)httpclient,感興趣的朋友可以了解下本文2013-12-12javascript的switch用法注意事項(xiàng)分析
這篇文章主要介紹了javascript的switch用法注意事項(xiàng),實(shí)例分析了switch語句進(jìn)行判定的原理與使用技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-02-02前端實(shí)現(xiàn)word文檔預(yù)覽和內(nèi)容提取的詳細(xì)過程
在前端直接讀取并原樣展示W(wǎng)ord文檔是一個(gè)相對(duì)復(fù)雜的任務(wù),因?yàn)閃ord文檔的格式(如.doc或.docx)與Web技術(shù)棧使用的格式(HTML、CSS)不兼容,下面這篇文章主要給大家介紹了關(guān)于前端實(shí)現(xiàn)word文檔預(yù)覽和內(nèi)容提取的詳細(xì)過程,需要的朋友可以參考下2024-05-05