使用場(chǎng)景
- 篩選上傳板甘、返回的數(shù)據(jù)
image.png
- 深拷貝去指針
序列化
- JSON.stringify
句法：JSON.stringify(value[, replacer[, space]])
repleacer返回的值為null或undefined則不做序列化處理
space就是一個(gè)美化輸出格式的參數(shù)
const obj = {
name:'kkk',
age:123,
innerObj:{
gender:'male'
}
}
const repleacer = (key,value)=>{
if(key === 'name'){
return value.toUpperCase()
}
if(typeof value === 'number'){
return undefined
}
return value
}
const repleacerWithoutReturn = (key,value)=>{
return null
}
console.log(JSON.stringify(obj,repleacer))
// {"name":"KKK","innerObj":{"gender":"male"}}
console.log(JSON.stringify(obj,repleacerWithoutReturn))
// null
句法：JSON.stringify(value[,attrArr[,space]])
接收數(shù)組來(lái)決定序列化屬性
const obj = {
name:'kkk',
age:123,
innerObj:{
gender:'male'
}
}
console.log(JSON.stringify(obj,['age','gender'])) // {"age":123}
// 這個(gè)有個(gè)問(wèn)題就是無(wú)法取到嵌套對(duì)象的屬性
console.log(JSON.stringify(obj,['age','innerObj'])) // {"age":123,"innerObj":{}}
console.log(JSON.stringify(obj.innerObj,['innerObj'])) // {}
space參數(shù)也可使用制表符（\t） 來(lái)縮進(jìn)
JSON.stringify({ uno: 1, dos : 2 }, null, '\t')
// { \
// "uno": 1, \
// "dos": 2 \
// }
注意：不能處理函數(shù)
- 自定義toJSON函數(shù)
這個(gè)就是在對(duì)象內(nèi)部定義toJSON函數(shù)方法，以函數(shù)劫持的方式取代原內(nèi)置默認(rèn)方法
const obj = {
instId:'B50',
instName:'AliPay',
toJSON:function(){
// 只返回定義的key value
return{
OU:this.instId+'_'+this.instName
}
}
}
console.log(JSON.stringify(obj)) // {"OU":"B50_AliPay"}
反序列化
- JSON.parse
句法 JSON.parse(text[, reviver])
reviver 同 stringify 的 repleacer
// 唯一注意的點(diǎn)就是單雙引號(hào)不嵌套使用
var jsonStr = '{"name":"kkk","age":222,gender:"male"}'
JSON.parse(jsonStr,function(key,value){
if(key === 'name'){
return value + '同學(xué)';
}
if(key === 'age'){
return value*2;
}
return value
})
// {name: "kkk同學(xué)", age: 444, gender: "male"}age: 444gender: "male"name: "kkk同學(xué)"__proto__: constructor: ? Object()hasOwnProperty: ? hasOwnProperty()isPrototypeOf: ? isPrototypeOf()propertyIsEnumerable: ? propertyIsEnumerable()toLocaleString: ? toLocaleString()toString: ? toString()valueOf: ? valueOf()__defineGetter__: ? __defineGetter__()__defineSetter__: ? __defineSetter__()__lookupGetter__: ? __lookupGetter__()__lookupSetter__: ? __lookupSetter__()get __proto__: ? __proto__()set __proto__: ? __proto__()
- eval
var jsonStr = '{"name":"kkk","age":222,gender:"male"}'
eval("("+jsonStr+")")
// {name: "kkk同學(xué)", age: 444, gender: "male"}age: 444gender: "male"name: "kkk同學(xué)"__proto__: constructor: ? Object()hasOwnProperty: ? hasOwnProperty()isPrototypeOf: ? isPrototypeOf()propertyIsEnumerable: ? propertyIsEnumerable()toLocaleString: ? toLocaleString()toString: ? toString()valueOf: ? valueOf()__defineGetter__: ? __defineGetter__()__defineSetter__: ? __defineSetter__()__lookupGetter__: ? __lookupGetter__()__lookupSetter__: ? __lookupSetter__()get __proto__: ? __proto__()set __proto__: ? __proto__()
參考:MDN-stringify糟把、MDN-parse亩钟、你不知道的JSON.parse()和JSON.stringify()
