javascript學習之json入門

2019-11-19 18:18:44

字體：大中小

來源：轉載

供稿：網友

1. 什么是JSON

JSON---Javascript Object Notation，前兩個單詞大家應該都認識，最后一個notation，是“記號、標記法”的意思，連在一起，便成了JSON。

它是一種輕量級的數據交換格式，是基于Javascript的一個子集，可以叫做Javascript對象表示法，是存儲和交換文本信息的語法，但它并不是Javascript獨有的數據格式，其它很多語言都可以對JSON進行解析和序列化。

2. JSON的由來

在21世紀初，Douglas Crockford（Web開發領域最知名的技術權威之一，ECMA JavaScript2.0標準化委員會委員，被JavaScript之父Brendan Eich稱為JavaScript的大宗師（Yoda），曾任Yahoo!資深JavaScript架構師，現任PayPal高級JavaScript架構師）試圖尋找一種更加簡便的數據交換格式，能夠在服務器之間交換數據，當時通用的數據交換語言是XML，但是Douglas Crockford認為XML的生成與解析都過于麻煩，所以他提出了一種更加簡化的格式，就是我們現在使用的JSON。

JSON的規格十分簡單，只用一個頁面幾百個字就能說清楚，而且Douglas Crackford稱這個規格永遠不用升級，因為該規定的都已經規定好了。

3. 為什么要用JSON

JSON類似于XML，比XML更小、更快、更容易解析。但同時XML也有它的不可替代性，應根據使用場景進行更合適的選擇；

JSON語法簡單，很容易理解，并且對象信息自描述，數據傳輸量小不占用帶寬；

JSON雖然遠不及emoji這一世界通用語言，但其實它的支持度也已經非?？捎^，支持的語言包括C，C#，Java，JavaScript，PHP，Python，Ruby等等；

對于Ajax應用程序來說，JSON比XML更快捷，更易用；

JSON的可讀性、可擴展性都非常好，編碼難度也比較低，即使不借助工具也能寫出比較規范的JSON

......

4. JSON怎么用

⑴ JSON的基本語法

① 并列的數據之間用逗號( , )分隔

② 映射用冒號( : )表示

③ 映射的集合用大括號( {} )表示

④ 并列數據的集合用方括號( [] )表示

例如：

上賽季的MVP是斯蒂芬庫里，場上位置是控球后衛，球衣號碼是30號，球隊是金州勇士隊

上賽季的FMVP是勒布朗詹姆斯，場上位置是小前鋒，球衣號碼是23號，球隊是克里夫蘭騎士隊

用JSON格式就可以表示為：

[{ "MVP":"Stephen Curry", "position":"Point Guard", "number":"30", "team":"Golden State Warriors" },{ "FMVP":"Lebron James", "position":"Small Forward", "number":"23", "team":"Cleveland Cavaliers" }]

更復雜的數據也可以使用JSON來進行表示，比如下面這段信息：最喜歡的編輯器是sublime，最喜歡的運動是籃球，最喜歡的球隊是馬刺隊，馬刺隊控衛有托尼帕克、帕蒂米爾斯，分衛有馬努吉諾比利、丹尼格林，小前鋒有科懷倫納德、凱爾安德森，大前鋒有拉馬庫斯阿爾德里奇、大衛李，中鋒有德維恩戴德蒙、保羅加索爾?！　?/p>

{ "favoriteEditor": "sublime", "favoriteSport": "basketball", "favoriteTeam":{ "Spurs":[ {  "PG":"Tony Parker",  "SG":"Danny Green",  "SF":"Kawhi Leonard",  "PF":"LaMarcus Aldridge",  "C":"Pau Gasol"  }, {  "PG":"Patty Mills",  "SG":"Manu Ginobili",  "SF":"Kyle Anderson",  "PF":"David Lee",  "C":"Dewayne Dedmon"  } ] } }

⑵ JSON的解析與序列化

① 通過eval()函數將JSON字符串解析為JavaScript原生值

var str = '[{"name":"james","height":"203","number":"23"}, {"name":"kobe","height":"198","number":"24"}]'; //定義JSON字符串 var oJson = eval(str); //通過eval()函數解析拿到JavaScript原生值 //接下來便可通過JS進行操作 alert(oJson[0].name); //james alert(oJson[1].height); //198

② 通過全局對象JSON的兩個方法parse()和stringify()進行操作

parse()可以將JSON字符串轉化為JavaScript原生值：

var str = '[{"name":"james","height":"203","number":"23"},{"name":"kobe","height":"198","number":"24"}]';  //定義JSON字符串 var oJson = JSON.parse(str); //通過JSON對象的parse方法得到該JSON字符串的JavaScript原生值 document.write("姓名：" + oJson[1].name + "<br/>" + "身高：" + oJson[1].height + "cm" + "<br/>" + "球衣號碼：" + oJson[1].number);

parse()也可以傳第二個參數，此時可以在還原出JavaScript值的時候將原值替換成自己想要的值，如下：

var str = '[{"name":"james","height":"203","number":"23"},{"name":"kobe","height":"198","number":"24"}]'; var oJson = JSON.parse(str, function(key, value){ if('name' == key){ return '球員' + value; }else if('number' == key){ return value + '號球衣'; }else{ return value; } }); alert(oJson[0].name + '更牛逼還是' + oJson[1].name + '更牛逼' + '/n' + '你喜歡' + oJson[0].number + '還是' + oJson[1].number);

stringify()可以將原生JavaScript值轉換為JSON字符串：

 var oJson = [{ name : "james", height : 203, number : 23 },{ name : "kobe", height : 198, number : 24 }]; var jsonStr = JSON.stringify(oJson,['name','number'],4); alert(jsonStr);

JSON.stringify(oJson,['name','number'],4);中的第一個參數表示需要轉化的JS對象；第二個參數用于過濾結果，表示只留下name和number，其他的key以及所對應的的value都不要了；第三個參數表示在JSON字符串中保留的縮進數，有縮進時可讀性更高，該參數也可以是一個字符串，比如'----'，此時彈出結果如下：

如果不需要保留縮進，那么最后一個參數空起來即可，但如果不需要進行過濾，第二個參數需設置為null占位，不能空起來，否則最后一個參數也會失效。

第二個參數也可以是函數，函數可以進行更加復雜的過濾：

var oJson = [{ name : "james", height : 203, position : '小前鋒' },{ name : "kobe", height : 198, position : '得分后衛' }]; var jsonStr = JSON.stringify(oJson,function(key,value){ switch(key){ case 'name': return '球員 ' + value; case 'height': return '身高 ' + value + 'cm'; case 'position':  return '位置 ' + value; default: return value; } },4); alert(jsonStr);