8 JSON
? ? 因平時作業時，使用JSON的場景比較多，其JSON語法不再介紹，僅介紹在JavaScript中JSON的決議和序列化，
8.1 JSON 物件
? ? JSON物件有兩個方法：
- stringify()：將JavaScript序列化為JSON字串
- parse()：將JSON決議為原生JavaScript值
let personInfo={
name:"Surpass",
age:28,
location:"Shanghai",
from:"Wuhan",
to:"Nanjing"
};
let jsonText=JSON.stringify(personInfo);
let jsonObj=JSON.parse(jsonText);
console.log(jsonText); // {"name":"Surpass","age":28,"location":"Shanghai","from":"Wuhan","to":"Nanjing"}
console.log(jsonObj); // {name: 'Surpass', age: 28, location: 'Shanghai', from: 'Wuhan', to: 'Nanjing'}
? ? 注意事項如下所示：
- 在序列化JavaScript物件時，所有函式和原型成員都會在結果中省略，值為undefined的任何屬性也會被跳過，最終得到的就是所有實體屬性均為有效JSON資料型別的表示
- JSON.parse()傳入的JSON字串無效，則會導致拋出錯誤
8.2 序列化選項
? ? JSON.stringify()方法除了要序列化的物件，還可以接收兩個引數，單獨或組合使用這些引數可以更好地控制JSON序列化
- 第一個引數是過濾器，可以是陣列或函式
- 第二個引數是用于縮進結果JSON字串的選項
8.2.1 過濾結果
- 1.過濾器為陣列
? ? 如果第二個引數是一個陣列，那么JSON.stringify()回傳的結果只會包含該陣列中列出的物件屬性，
let personInfo={
name:"Surpass",
age:28,
location:"Shanghai",
from:"Wuhan",
to:"Nanjing"
};
let jsonText=JSON.stringify(personInfo,["name","from"]);
console.log(jsonText); // {"name":"Surpass","from":"Wuhan"}
- 2.過濾器是函式
? ? 如果第二個引數是一個函式，則函式接收兩個引數：屬性名（key）和屬性值（value），可以根據key決定要對其屬性執行什么操作，key始終是字串，當值不屬于某個鍵/值對時則為空字串，否則回傳的值就是相應key對應的值，若回傳undefined會導致屬性被忽略，代碼如下所示：
let personInfo={
name:"Surpass",
age:28,
location:"Shanghai",
from:"Wuhan",
to:"Nanjing"
};
let jsonText=JSON.stringify(personInfo,(key,value)=>{
switch (key) {
case "name":
return value+"@";
case "from":
return value+"+";
case "age":
return value+28;
case "location":
return undefined;
default:
return value;
}
});
console.log(jsonText);
輸出結果如下所示：
{"name":"Surpass@","age":56,"from":"Wuhan+","to":"Nanjing"}
8.2.2 字串縮進
? ? JSON.stringify()方法的第三個引數控制縮進和空格，在這個引數是數值時，表示每一級縮進的空格數，示例代碼如下所示：
let personInfo={
name:"Surpass",
age:28,
location:"Shanghai",
from:"Wuhan",
to:"Nanjing"
};
let jsonText=JSON.stringify(personInfo,(key,value)=>{
switch (key) {
case "name":
return value+"@";
case "from":
return value+"+";
case "age":
return value+28;
case "location":
return undefined;
default:
return value;
}
},4);
console.log(jsonText);
輸出結果如下所示：
{
"name": "Surpass@",
"age": 56,
"from": "Wuhan+",
"to": "Nanjing"
}
最大縮進值為10，大于10 的值會自動設定為10
如果縮進引數是一個字串而非數值，那么JSON字串中就會使用這個字串而不是空格來縮進
let personInfo={
name:"Surpass",
age:28,
location:"Shanghai",
from:"Wuhan",
to:"Nanjing"
};
let jsonText=JSON.stringify(personInfo,null,"++++");
console.log(jsonText);
輸出結果如下所示：
{
++++"name": "Surpass",
++++"age": 28,
++++"location": "Shanghai",
++++"from": "Wuhan",
++++"to": "Nanjing"
}
8.3 決議選項
? ? JSON.parse()方法也可以接收一個額外的引數，這個函式會針對每個鍵/值對都呼叫一次，也接收兩個引數屬性名（key）和屬性值（value），同時也需要回傳值，如果函式回傳undefined，則結果中洗掉相應的鍵，如果回傳了其他任何值，則該值就會成為相應鍵的值插入到結果中，
let personInfo={
name:"Surpass",
age:28,
location:"Shanghai",
from:"Wuhan",
to:"Nanjing",
neighbour:["Surpass"]
};
let neighbourArray=["Kevin","Tina","Jeniffer"];
let jsonText=JSON.stringify(personInfo);
let jsonObj=JSON.parse(jsonText,
(key,value)=> key == "neighbour" ? neighbourArray:value
);
console.log(JSON.stringify(jsonObj,null,4));
輸出結果如下所示：
{
"name": "Surpass",
"age": 28,
"location": "Shanghai",
"from": "Wuhan",
"to": "Nanjing",
"neighbour": [
"Kevin",
"Tina",
"Jeniffer"
]
}
原文地址：https://www.jianshu.com/p/aca2b3177540
本文同步在微信訂閱號上發布，如各位小伙伴們喜歡我的文章，也可以關注我的微信訂閱號：woaitest，或掃描下面的二維碼添加關注：
作者： Surpassme
來源： http://www.jianshu.com/u/28161b7c9995/
http://www.cnblogs.com/surpassme/
宣告：本文著作權歸作者所有，歡迎轉載，但未經作者同意必須保留此段宣告，且在文章頁面明顯位置給出 原文鏈接 ，否則保留追究法律責任的權利，如有問題，可發送郵件 聯系，讓我們尊重原創者著作權，共同營造良好的IT朋友圈，
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/503218.html
標籤：其他