json2.js主要功能是做什么的?
json2.js提供了json的序列化和反序列化方法,可以將一個json對象轉換成json字符串,也可以將一個json字符串轉換成一個json對象。
json2.js在瀏覽器不支持json.parse的內置方法時,最有效。json2.js會創建一個內部的全局變量,提供json對象與字符串之間的轉換。
由于eval已經不提倡使用了,并存在一定的危險,建議使用內置parse json的方法,或者直接使用json2.js。
json2.js的源碼地址:
https://github.com/douglascrockford/JSON-js
Visual Studio用戶可以直接通過Nuget來獲得。
使用方法很簡單:
1、引用json2.js:
<script type="text/javascript" src="/CoreResource/JS/json2.min.js"></script>
2、JSON.stringify() 序列化方法
方法用于將javaScript 的json數據轉化為json格式的文本串。主要用于向服務端返回數據。
var jsonObj = { "id": "01", "name": "Tom" };JSON.stringify(jsonObj);
3、JSON.parse()反序列化方法
var jsonString = {"id": "01", "name": "Tom" };JSON.parse(jsonString);
用于將json格式的文本串轉化為javaScript 的json數據,例如:
var records = { "table": "GPS_MANAGER", "token": "32sdfj-349sfdnfs32-fsdf348imfg323-df34", "pk": "GPS_LONGITUDE,GPS_LATITUDE", "rows": [ { "type": "modify", "columns": [ { "GPS_LONGITUDE": "GPS_LONGITUDE", "old": "", "new": "112.9152287" }, { "GPS_LATITUDE": "GPS_LATITUDE", "old": "", "new": "22.6689977" }, { "GPSMARK": "GPSMARK", "old": "", "new": "1" }, { "RTUNAME": "RTUNAME", "old": "", "new": "大邊巖站" }, { "RTUID": "RTUID", "old": "", "new": "13525" }, { "NOTE": "NOTE", "old": "", "new": "undefined" }, { "Y": "Y", "old": "", "new": "2508146.500000" }, { "X": "X", "old": "", "new": "696776.812500" }, { "GPS_HEIGHT": "GPS_HEIGHT", "old": "", "new": "0" }, { "GPS_GUID": "GPS_GUID", "old": "", "new": "1381c526-2d90-442f-889c-731485a960c1" } ] } ]}var jsonObj = JSON.parse(records );
然后就可以通過前端javascript代碼解析json文本傳遞過來的數據,json是一種以key:value的復合格式存儲數據的協議,這樣簡化了數據傳遞量,比較xml更能減輕客戶端負載。
但是個人感覺json數據格式沒有xml文件那樣一目了然!
3. Json驗證工具
(1). Json文本在線驗證工具JSONLint:http://jsonlint.com/
通過此在線工具驗證json格式文本串是否符合json數據格式。
Json格式查看器json viewer 1.1 漢化中文綠色版
下面是其他網友的補充
需要加載json2.js
這是個人在最近使用json時做的總結,拿出來給沒接觸過的小弟們曬曬,適用與沒接觸過json的人員,其中json2。js請到json官網下載。
<script> //直接聲明json數據結構 var myJSONObject = {"bindings": [ {"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"}, {"ircEvent": "PRIVMSG", "method": "deleteURI", "regex": "^delete.*"}, {"ircEvent": "PRIVMSG", "method": "randomURI", "regex": "^random.*"} ] }; //聲明字符串,可對比一下json文本與我們正常文本的區別 var normalstring='[{persons:[{name:"jordan",sex:"m",age:"40"}, {name:"bryant",sex:"m",age:"28"}, {name:"McGrady",sex:"m",age:"27"} ]}]';var jsontext='[{"persons":[{"name":"jordan","sex":"m","age":"40"}, {"name":"bryant","sex":"m","age":"28"}, {"name":"McGrady","sex":"m","age":"27"} ]}]'; //調用eval函數轉換為json對象, var myE = eval(normalstring);document.writeln(myE '<br><br>'); //將json對象轉換為字符串var text = JSON.stringify(myE);//對比轉換后的json文本與聲明的文本區別document.writeln('轉換后的json文本:' text '<br><br>聲明的json格式文本' jsontext '<br><br>聲明的普通格式文本' normalstring '<br><br>'); //當安全比較重要的時候使用JSON解析就好一些。JSON解析只會識別JSON文本并且它更安全,下面調用json的parse函數對文本數據轉換生成json數據結構 var myData = JSON.parse(jsontext);document.writeln(myData '<br><br>'); //下面是對json對象的增刪查改操作//聲明json對象 var jsonObj2={persons:[{name:"jordan",sex:"m",age:"40"}, {name:"bryant",sex:"m",age:"28"}, {name:"McGrady",sex:"m",age:"27"} ]};var persons=jsonObj2.persons;var str="";var person={name:"yaoMing",sex:"m",age:"26"};//以下為json對象的操作,去掉注釋可以查看操作結果//jsonObj2.persons.push(person);//數組最后加一條記錄//jsonObj2.persons.pop();//刪除最后一項//jsonObj2.persons.shift();//刪除第一項jsonObj2.persons.unshift(person);//數組最前面加一條記錄 只要適合Javascript的方法都是可以用在JSON對象的數組中的!所以還有另外的方法splice( )進行crud操作! //刪除//jsonObj2.persons.splice(0,2);//開始位置,刪除個數//替換不刪除var self={name:"tom",sex:"m",age:"24"};var brother={name:"Mike",sex:"m",age:"29"};jsonObj2.persons.splice(1,0,self,brother,self);//開始位置,刪除個數,插入對象//替換并刪除//jsonObj2.persons.splice(0,1,self,brother);//開始位置,刪除個數,插入對象for(var i=0;i<persons.length;i ){ var cur_person=persons[i]; str =cur_person.name "'sex is " cur_person.sex " and age is " cur_person.age "<br><br>"; }document.writeln(str);//轉換為json文本var myjsonobj = JSON.stringify(jsonObj2);document.writeln(myjsonobj);</script>
3、增強功能:
比如說,我們的數據非常復雜,還有類似頭像,昵稱,個人簽名之類的信息。
可是我保存在本地,只需要用戶名,和性別,腫么破呢?
也許你會說 so easy, 遍歷數據重新提取下即可。
例如:
data = [ {name: , sex:, age: }, {name: , sex:, age: }, {name: , sex:, age: }]; ( i=, new_data=[]; i<data.length; i++) { new_data.push({ name: data[i].name, sex: data[i].sex });} str_json = .stringify(new_data);console.log(str_json);var data = [ {name: "王尼瑪", sex:1, age: 30}, {name: "王尼美", sex:0, age: 20}, {name: "王大錘", sex:1, age: 30}];for (var i=0, new_data=[]; i<data.length; i++) { new_data.push({ name: data[i].name, sex: data[i].sex });}var str_json = JSON.stringify(new_data);console.log(str_json);
確實分分鐘搞定。
其實我們只需要用 stringify 第二個參數即可簡單處理這種問題。
data = [ {name: , sex:, age: }, {name: , sex:, age: }, {name: , sex:, age: }]; str_json = .stringify(data, [, ]);console.log(str_json);var data = [ {name: "王尼瑪", sex:1, age: 30}, {name: "王尼美", sex:0, age: 20}, {name: "王大錘", sex:1, age: 30}];var str_json = JSON.stringify(data, ["name", "sex"]);console.log(str_json);
第二個參數只要傳入需要的keys數組,就非常輕松的就完成這種處理了。
當然如果我們要更糾結的處理,比如要把 1,0 修改為男女,那么第二個參數可以用回調函數來處理。
data = [ {name: , sex:, age: }, {name: , sex:, age: }, {name: , sex:, age: }]; str_json = .stringify(data, (k === ) { [, ][v]; } v;});console.log(str_json);var data = [ {name: "王尼瑪", sex:1, age: 30}, {name: "王尼美", sex:0, age: 20}, {name: "王大錘", sex:1, age: 30}];var str_json = JSON.stringify(data, function (k, v) { if (k === "sex") { return ["女", "男"][v]; } return v;});console.log(str_json);
第二個參數如此強悍,為我們省去了不少麻煩。
新聞熱點
疑難解答