溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

json2.js怎么用

發(fā)布時(shí)間:2021-08-10 11:14:57 來源:億速云 閱讀:390 作者:小新 欄目:web開發(fā)

這篇文章給大家分享的是有關(guān)json2.js怎么用的內(nèi)容。小編覺得挺實(shí)用的,因此分享給大家做個(gè)參考,一起跟隨小編過來看看吧。

json2.js主要功能是做什么的?

json2.js提供了json的序列化和反序列化方法,可以將一個(gè)json對(duì)象轉(zhuǎn)換成json字符串,也可以將一個(gè)json字符串轉(zhuǎn)換成一個(gè)json對(duì)象。

json2.js在瀏覽器不支持json.parse的內(nèi)置方法時(shí),最有效。json2.js會(huì)創(chuàng)建一個(gè)內(nèi)部的全局變量,提供json對(duì)象與字符串之間的轉(zhuǎn)換。

由于eval已經(jīng)不提倡使用了,并存在一定的危險(xiǎn),建議使用內(nèi)置parse json的方法,或者直接使用json2.js。

json2.js的源碼地址:

https://github.com/douglascrockford/JSON-js

Visual Studio用戶可以直接通過Nuget來獲得。

使用方法很簡(jiǎn)單:

1、引用json2.js:

<script type="text/javascript" src="/CoreResource/JS/json2.min.js"></script>

2、JSON.stringify() 序列化方法

方法用于將javaScript 的json數(shù)據(jù)轉(zhuǎn)化為json格式的文本串。主要用于向服務(wù)端返回?cái)?shù)據(jù)。

var jsonObj = { "id": "01", "name": "Tom" };
JSON.stringify(jsonObj);

3、JSON.parse()反序列化方法

var jsonString = {"id": "01", "name": "Tom" };
JSON.parse(jsonString);

用于將json格式的文本串轉(zhuǎn)化為javaScript 的json數(shù)據(jù),例如:

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文本傳遞過來的數(shù)據(jù),json是一種以key:value的復(fù)合格式存儲(chǔ)數(shù)據(jù)的協(xié)議,這樣簡(jiǎn)化了數(shù)據(jù)傳遞量,比較xml更能減輕客戶端負(fù)載。

但是個(gè)人感覺json數(shù)據(jù)格式?jīng)]有xml文件那樣一目了然!

3. Json驗(yàn)證工具

(1). Json文本在線驗(yàn)證工具JSONLint:http://jsonlint.com/
通過此在線工具驗(yàn)證json格式文本串是否符合json數(shù)據(jù)格式。

Json格式查看器json viewer 1.1 漢化中文綠色版

下面是其他網(wǎng)友的補(bǔ)充

需要加載json2.js

這是個(gè)人在最近使用json時(shí)做的總結(jié),拿出來給沒接觸過的小弟們曬曬,適用與沒接觸過json的人員,其中json2。js請(qǐng)到j(luò)son官網(wǎng)下載。

<script> 
//直接聲明json數(shù)據(jù)結(jié)構(gòu) 
var myJSONObject = {"bindings": [ 
    {"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"}, 
    {"ircEvent": "PRIVMSG", "method": "deleteURI", "regex": "^delete.*"}, 
    {"ircEvent": "PRIVMSG", "method": "randomURI", "regex": "^random.*"} 
  ] 
};
 
//聲明字符串,可對(duì)比一下json文本與我們正常文本的區(qū)別
 
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"} ]}]';
 
//調(diào)用eval函數(shù)轉(zhuǎn)換為json對(duì)象,
 
var myE = eval(normalstring);
document.writeln(myE '<br><br>');
 
//將json對(duì)象轉(zhuǎn)換為字符串
var text = JSON.stringify(myE);
//對(duì)比轉(zhuǎn)換后的json文本與聲明的文本區(qū)別
document.writeln('轉(zhuǎn)換后的json文本:' text '<br><br>聲明的json格式文本' jsontext '<br><br>聲明的普通格式文本' normalstring '<br><br>');
 
//當(dāng)安全比較重要的時(shí)候使用JSON解析就好一些。JSON解析只會(huì)識(shí)別JSON文本并且它更安全,下面調(diào)用json的parse函數(shù)對(duì)文本數(shù)據(jù)轉(zhuǎn)換生成json數(shù)據(jù)結(jié)構(gòu)
 
var myData = JSON.parse(jsontext);
document.writeln(myData '<br><br>');
 
//下面是對(duì)json對(duì)象的增刪查改操作
//聲明json對(duì)象
 
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對(duì)象的操作,去掉注釋可以查看操作結(jié)果
//jsonObj2.persons.push(person);//數(shù)組最后加一條記錄
//jsonObj2.persons.pop();//刪除最后一項(xiàng)
//jsonObj2.persons.shift();//刪除第一項(xiàng)
jsonObj2.persons.unshift(person);//數(shù)組最前面加一條記錄 只要適合Javascript的方法都是可以用在JSON對(duì)象的數(shù)組中的!所以還有另外的方法splice( )進(jìn)行crud操作! //刪除
//jsonObj2.persons.splice(0,2);//開始位置,刪除個(gè)數(shù)
//替換不刪除
var self={name:"tom",sex:"m",age:"24"};
var brother={name:"Mike",sex:"m",age:"29"};
jsonObj2.persons.splice(1,0,self,brother,self);//開始位置,刪除個(gè)數(shù),插入對(duì)象
//替換并刪除
//jsonObj2.persons.splice(0,1,self,brother);//開始位置,刪除個(gè)數(shù),插入對(duì)象
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);
//轉(zhuǎn)換為json文本
var myjsonobj = JSON.stringify(jsonObj2);
document.writeln(myjsonobj);
</script>

 3、增強(qiáng)功能:

比如說,我們的數(shù)據(jù)非常復(fù)雜,還有類似頭像,昵稱,個(gè)人簽名之類的信息。
可是我保存在本地,只需要用戶名,和性別,腫么破呢?
也許你會(huì)說 so easy, 遍歷數(shù)據(jù)重新提取下即可。
例如:

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);

確實(shí)分分鐘搞定。

其實(shí)我們只需要用 stringify 第二個(gè)參數(shù)即可簡(jiǎn)單處理這種問題。

 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);

第二個(gè)參數(shù)只要傳入需要的keys數(shù)組,就非常輕松的就完成這種處理了。

當(dāng)然如果我們要更糾結(jié)的處理,比如要把 1,0 修改為男女,那么第二個(gè)參數(shù)可以用回調(diào)函數(shù)來處理。

 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);

感謝各位的閱讀!關(guān)于“json2.js怎么用”這篇文章就分享到這里了,希望以上內(nèi)容可以對(duì)大家有一定的幫助,讓大家可以學(xué)到更多知識(shí),如果覺得文章不錯(cuò),可以把它分享出去讓更多的人看到吧!

向AI問一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI