JSON的parse()方法介紹

更新時間：2019年01月31日 10:39:20 作者：mumu1998

今天小編就為大家分享一篇關于JSON的parse()方法介紹，小編覺得內容挺不錯的，現(xiàn)在分享給大家，具有很好的參考價值，需要的朋友一起跟隨小編來看看吧

parse()方法的介紹：

在接收服務器數(shù)據(jù)時一般是字符串。

我們可以使用 JSON.parse() 方法將數(shù)據(jù)轉換為 JavaScript 對象。

語法

JSON.parse(text[, reviver])

參數(shù)說明：

text:必需，一個有效的 JSON 字符串。
reviver: 可選，一個轉換結果的函數(shù)，將為對象的每個成員調用此函數(shù)。

下面我們來看一個實例：

<p id="demo"></p>
<script>
var obj = JSON.parse('{ "name":jb51", "alexa":10000, "site":www.dhdzp.com }');
document.getElementById("demo").innerHTML = obj.name + "：" + obj.site;
</script>

首先通過parse()方法將JSON數(shù)據(jù)轉換為JavaScript對象，

解析完成后，我們就可以在網(wǎng)頁上使用JSON數(shù)據(jù)了

從服務端接收 JSON 數(shù)據(jù)（數(shù)組JSON數(shù)據(jù)）

我們可以使用 AJAX 從服務器請求 JSON 數(shù)據(jù)，并解析為 JavaScript 對象。

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服務端數(shù)據(jù)需要自個編寫。

JSON中有個異常解析數(shù)據(jù)

JSON 不能存儲 Date 對象。如果你需要存儲 Date 對象，需要將其轉換為字符串。之后再將字符串轉換為 Date 對象。

<p id="demo"></p>
<script>      //將字符串轉換為data對象
var text = '{ "name":"csdn", "initDate":"2018-12-14", "site":www.dhdzp.com}';
var obj = JSON.parse(text);
obj.initDate = new Date(obj.initDate);
document.getElementById("demo").innerHTML = obj.name + "創(chuàng)建日期: " + obj.initDate;
</script>

這時我們可以啟用JSON的第二個參數(shù)：

<p id="demo"></p>
<script>
var text = '{ "name":"csdn", "initDate":"2018-12-14", "site":"www.dhdzp.com"}';
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ù)作為字符串存儲，之后再將字符串轉換為函數(shù)。

var text = '{ "name":"jb51", "alexa":"function () {
return 10000;}",
"site":"www.dhdzp.com"}';
var obj = JSON.parse(text);
obj.alexa = eval("(" + obj.alexa + ")");      注意：最好不要在json中使用函數(shù)
document.getElementById("demo").innerHTML = obj.name + " Alexa 排名：" + obj.alexa();

總結

以上就是這篇文章的全部內容了，希望本文的內容對大家的學習或者工作具有一定的參考學習價值，謝謝大家對腳本之家的支持。如果你想了解更多相關內容請查看下面相關鏈接

您可能感興趣的文章:

json
parse

文本框中,回車鍵觸發(fā)事件的js代碼[多瀏覽器兼容]
在文本框中輸入完內容后,經常需要按回車,焦點跳到下個文本框,或者觸發(fā)按鈕事件
2010-06-06
JS組件Bootstrap Table布局詳解
這篇文章主要為大家詳細介紹了JS組件Bootstrap Table布局，用戶體驗比較好，更好兼容各種客戶端，需要了解更多bootstrap table的朋友可以參考下
2016-05-05
JS前端筆試題分析
這篇文章主要介紹了JS前端筆試題,結合實例形式分析了javascript字符串、數(shù)組及日期操作相關技巧,需要的朋友可以參考下
2016-12-12
JavaScript中setter和getter方法介紹
這篇文章主要介紹了JavaScript中setter和getter方法介紹的相關資料,非常不錯，具有參考借鑒價值，需要的朋友可以參考下
2016-07-07
Javascript仿新浪游戲頻道鼠標懸停顯示子菜單效果
這篇文章主要介紹了Javascript仿新浪游戲頻道鼠標懸停顯示子菜單效果,涉及鼠標事件及頁面元素結點的遍歷技巧,具有一定參考借鑒價值,需要的朋友可以參考下
2015-08-08
如何用JS判斷數(shù)組中是否存在某個值或者某個對象的值
數(shù)組是我們編程中經常使用的的數(shù)據(jù)結構之一,在處理數(shù)組時，我們經常需要在數(shù)組中查找特定的值,下面這篇文章主要給大家介紹了關于如何用JS判斷數(shù)組中是否存在某個值或者某個對象的值的相關資料,需要的朋友可以參考下
2023-01-01
微信小程序如何獲取網(wǎng)絡狀態(tài)
這篇文章主要介紹了微信小程序如何獲取網(wǎng)絡狀態(tài),文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下
2019-07-07
微信小程序數(shù)據(jù)劫持代理的實現(xiàn)
本文主要介紹了微信小程序?數(shù)據(jù)劫持代理的實現(xiàn)，文中通過示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2022-01-01
前端云原生之微信小程序云服務配置指南
前端邊界又拓寬,走進火熱的云原生云開發(fā)賽道,隨著云原生時代的到來,各大廠紛紛上云,下面這篇文章主要給大家介紹了關于前端云原生之微信小程序云服務配置的相關資料,需要的朋友可以參考下
2022-05-05
微信小程序實現(xiàn)多張照片上傳功能
這篇文章主要介紹了微信小程序實現(xiàn)多張照片上傳功能,當服務器的狀態(tài)碼為200且圖片上傳完畢后將圖片的src轉化為Json字符串存在數(shù)組中以便將其添加到數(shù)據(jù)庫,本文通過實例代碼介紹的非常詳細,需要的朋友可以參考下
2024-03-03