深入理解标准配置对象json

ZQF
86 阅读4分钟

描述

JSON 是一种语法，用来序列化对象、数组、数值、字符串、布尔值和 null 。它基于 JavaScript 语法，
但与之不同：JavaScript 不是 JSON，JSON 也不是 JavaScript。

JSON.stringify()描述

JSON.stringify() 方法将一个 JavaScript 对象或值转换为 JSON 字符串，如果指定了一个 replacer 函数，
则可以选择性地替换值，或者指定的 replacer 是数组，则可选择性地仅包含数组指定的属性。
语法
JSON.stringify(value[, replacer [, space]])
value
将要序列化成 一个 JSON 字符串的值。
replacer 可选
如果该参数是一个函数，则在序列化过程中，被序列化的值的每个属性都会经过该函数的转换和处理；如果该参数是一个数组，
则只有包含在这个数组中的属性名才会被序列化到最终的 JSON 字符串中；如果该参数为 null 或者未提供，
则对象所有的属性都会被序列化。
space 可选
指定缩进用的空白字符串，用于美化输出（pretty-print）；如果参数是个数字，它代表有多少的空格；上限为 10。
该值若小于 1，则意味着没有空格；如果该参数为字符串（当字符串长度超过 10 个字母，取其前 10 个字母），
该字符串将被作为空格；如果该参数没有提供（或者为 null），将没有空格。
处理date日期对象
//转换值如果有 toJSON() 方法，该方法定义什么值将被序列化。Date 日期调用了 toJSON() 将其转换为了 string 字符串
（同 Date.toISOString()），因此会被当做字符串处理。
let obj = {
    date:new Date(), 
}
console.log('obj',JSON.stringify(obj))
//{"date":"2022-09-28T03:06:30.837Z"}
处理NaN 和 Infinity 格式的数值及 null
//NaN 和 Infinity 格式的数值及 null 都会被当做 null。
let obj = {
    max:Infinity,
    nan:NaN,
    nullKey:null,
}
console.log('obj',JSON.stringify(obj))
// {"max":null,"nan":null,"nullKey":null}
处理包装对象
//布尔值、数字、字符串的包装对象在序列化过程中会自动转换成对应的原始值。
let obj = {
    booleanKey:new Boolean(false),
    numberKey:new Number(3),
    stringKey:new String('string')
}
console.log('obj',JSON.stringify(obj))
// {"booleanKey":false,"numberKey":3,"stringKey":"string"}
处理undefined、任意的函数以及 symbol 值
//undefined、任意的函数以及 symbol 值，在序列化过程中会被忽略（出现在非数组对象的属性值中时）或者被转换
成null（出现在数组中时）。
let obj = {
    undefinedKey:undefined,
    fnKey:()=>{},
    symbolKey:Symbol('key'),
    arrKey:[undefined,()=>{},Symbol('key')]
}
console.log('obj',JSON.stringify(obj))
//{"arrKey":[null,null,null]}
处理循环引用的对象
////对包含循环引用的对象（对象之间相互引用，形成无限循环）执行此方法，会抛出错误。
let obj = {
    undefinedKey:undefined,
    fnKey:()=>{},
    symbolKey:Symbol('key'),
    arrKey:[undefined,()=>{},Symbol('key')]
}
obj.childrenObj = obj
console.log('obj',JSON.stringify(obj))
//index.js:34 Uncaught TypeError: Converting circular structure to JSON
    --> starting at object with constructor 'Object'
    --- property 'childrenObj' closes the circle
    at JSON.stringify (<anonymous>)
不可枚举的属性默认会被忽略
// 不可枚举的属性默认会被忽略：
JSON.stringify(
    Object.create(
        null,
        {
            x: { value: 'x', enumerable: false },
            y: { value: 'y', enumerable: true }
        }
    )
);
// "{"y":"y"}"
replacer参数
//replacer 参数可以是一个函数或者一个数组。作为函数，它有两个参数，键（key）和值（value），它们都会被序列化。
function replacer(key, value) {
  if (typeof value === "string") {
    return undefined;
  }
  return value;
}

var foo = {foundation: "Mozilla", model: "box", week: 45, transport: "car", month: 7};
var jsonString = JSON.stringify(foo, replacer);
//{"week":45,"month":7}

//如果 replacer 是一个数组，数组的值代表将被序列化成 JSON 字符串的属性名。
JSON.stringify(foo, ['week', 'month']);
// '{"week":45,"month":7}', 只保留 “week” 和 “month” 属性值。
space 参数
JSON.stringify({ a: 2 }, null, " ");   // '{\n "a": 2\n}'

JSON.parse()

JSON.parse() 方法用来解析 JSON 字符串，构造由字符串描述的 JavaScript 值或对象。提供可选的 reviver 函数用
以在返回之前对所得到的对象执行变换 (操作)。
参数
text
要被解析成 JavaScript 值的字符串，关于 JSON 的语法格式，请参考：JSON。

reviver 可选
转换器，如果传入该参数 (函数)，可以用来修改解析生成的原始值，调用时机在 parse 函数返回之前。
示例
JSON.parse('[1, 5, "false"]'); // [1, 5, "false"]
JSON.parse('{"1": 1, "2": 2,"3": {"4": 4, "5": {"6": 6}}}', function (k, v) {
    console.log(k); // 输出当前的属性名，从而得知遍历顺序是从内向外的，
                    // 最后一个属性名会是个空字符串。
    return v;       //返回原始属性值，相当于没有传递reviver参数。
});

// 1
// 2
// 4
// 6
// 5
// 3
avatar
文章
阅读
粉丝