JSON 对象蕴含两个办法:一是用于解析成 JSON 对象的 parse();二是用于将对象转换为 JSON 字符串办法的 stringify()。这两个办法比拟罕用
JSON.parse
该办法的语法为:JSON.parse(text[, reviver])
参数阐明:text: 必须,一个无效的 JSON 字符串。
reviver: 可选,一个转换后果的函数,将为对象的每个成员调用此函数。
第二个参数应用例子,第二个参数能够将待处理的字符串进行肯定的操作解决
let result = JSON.parse('{"a":3}', (k, v) => {if (k === "")
return v
return v * 2
})
console.log(result) // {a:6}
JSON.stringify
MDN 形容
avaScript 对象或值转换为 JSON 字符串,默认该办法有三个参数
JSON.stringify(value[, replacer[, space]])
value: 必须,要转换的 JavaScript 值(通常为对象或数组)。
replacer: 可选。用于转换后果的函数或数组。如果 replacer 为函数,则 JSON.stringify 将调用该函数,并传入每个成员的键和值。应用返回值而不是原始值。如果此函数返回 undefined,则排除成员。根对象的键是一个空字符串:””。如果 replacer 是一个数组,则仅转换该数组中具备键值的成员。成员的转换程序与键在数组中的程序一样。
space: 可选,文本增加缩进、空格和换行符,如果 space 是一个数字,则返回值文本在每个级别缩进指定数目的空格,如果 space 大于 10,则文本缩进 10 个空格。space 也能够应用非数字,如:\t。
应用例子
JSON.stringify({x: [1, undefined, function(){}, Symbol('')] }) // {"x":[1,null,null,null]}
function replacer(key,value){if(typeof value === "string"){return undefined}
return value
}
var foo = {a:"aa",b:"bb",c:1,d:"d",e:5}
// 通过替换办法把对象中的属性为字符串的过滤掉
var jsonstr1= JSON.stringify(foo,replacer)
console.log(jsonstr1) // {"c":1,"e":5}
// 第三个参数传入的是多个空格的时候,则会减少后果字符串外面的间距数量
console.log(JSON.stringify({a:1},null," "))
// {
// "a": 1
// }
console.log(JSON.stringify({a:1},null,"")) // {"a":1}
JSON.stringify 办法的实现要思考到各种数据类型输入的理论状况。
输出 | 输入 |
---|---|
undefined | “undefined” |
boolean | “true/false” |
number | 字符串类型数字 |
symbol | undefined |
null | “null” |
string | string |
NaN Infinity | “null” |
function | undefined |
Array 数组中呈现 undefined,function,symbol | “null” |
RegExp | “{}” |
Date | Date 的 toJson() 字符串, 对蕴含循环援用的对象(对象之间互相援用,造成有限循环)执行此办法,会抛出谬误。 |
一般的 Object | 如果有 toJson() 办法,序列化 toJson() 返回值;如果属性中呈现 undefinde, 函数,symbol,疏忽;所有以 Symbol 为属性键的属性都会被疏忽, 即使 replacer 参数中强制指定蕴含了它们。 |
此外,其余类型的对象,包含 Map/Set/WeakMap/WeakSet,仅会序列化可枚举的属性
实现代码
function myJsonStringfy(e) {
let type = typeof e;
// typeof [] 'object'
// typeof {} 'object'
if (type !== "object") {
let result = e;
// 根底数据类型解决
if (Number.isNaN(e) || e === Infinity || e === -Infinity) {
//NaN 和 Infinity 序列化返回 "null"
result = "null"
} else if (type === "function" || type === "undefined" || type === "symbol") {
// 因为 function 序列化返回 undefined,因而和 undefined、symbol 一起解决
return undefined
} else if (type === "string") {return `"${e}"`
}
return String(result)
} else if (type === "object") {
// 解决 typeof null 后果是 object 历史遗留 BUG
console.log(e, e.toJSON)
if (e === null) {return "null"} else if (e.toJSON && typeof e.toJSON === "function") {return myJsonStringfy(e.toJSON())
} else if (e instanceof Array) {
// 解决数组
let result = []
e.forEach((item, index) => {
// Array 数组中呈现 undefined,function,symbol 返回字符串 null
if (typeof item === "undefined" || typeof item === "function" || typeof item === "symbol") {result[index] = "null";
} else {result[index] = myJsonStringfy(item)
}
})
result = `[${result}]`
return result.replace(/'/g,'"');
} else {
// 一般对象状况
let result = []
Object.keys(e).forEach(item => {console.log("...", item, typeof item)
if (typeof item !== "symbol") {
// key 如果是 symbol 对象,疏忽
if (e[item] !== undefined && typeof e[item] !== 'function' && typeof e[item] !== 'symbol') {
// 键值如果是 undefined、function、symbol 为属性值,疏忽
result.push('"'+ item +'"' + ":" + myJsonStringfy(e[item]));
}
}
})
return ("{" + result + "}").replace(/'/g,'"');
}
}
}