JSON.stringify和JSON.parse详解

JSON.stringify()

MDN：JSON.stringify()方法将一个JavaScript值（对象或数组）转换为一个JSON字符串，如果指定了replacer是一个函数，则可选择性的替换，或者如果指定了replacer是一个数组，则可选择性地仅包含数组指定的属性。

语法

// []表示可选参数
JSON.stringify(value[, replacer [, space]])

• value：将要序列化成一个JSON字符串的值
• replacer：如果该参数是一个函数，则在序列化过程中，被序列化的值的每个属性都会经过该函数的转换和处理；如果该参数是一个数组，则只有包含在这个数组中的属性名才会被序列化到最终的JSON字符串中；如果该参数为null或者未提供，则对象所有的属性都会被序列化
• space：指定缩进用的空白字符串，用户美化输出pretty-print；如果参数是个数字，它代表有多少的空格；上限为10。该值若小于1，则意味着没有空格；如果该参数为字符串，则该字符串将被作为空格；如果该参数没有提供，将没有空格

返回值

一个表示给定值的JSON字符串

描述

• 布尔值、数字、字符串的包装类型在序列化过程中会自动转换成对应的原始值

console.log(
  JSON.stringify({
    flag: new Boolean(false),
    num: new Number(0),
    str: new String('false'),
  }),
);
// 输出 {"flag":false,"num":0,"str":"false"}

• undefined、任意的函数以及symbol值，在序列化过程会被忽略

console.log(JSON.stringify({ und: undefined, obj: Object }));
// 输出 {}

replacer参数

replacer参数可以是一个数组或者一个函数。作为函数，它有两个参数，key和value，它们都会被序列化。

const jsonString = JSON.stringify(
  { name: 'jack', age: 21, gender: 'male' },
  function(key,value){
    return value
  },
  2,
);
console.log(jsonString)
// 输出 
//{
//  "name": "jack",
//  "age": 21,
//  "gender": "male"
//}

space参数

space参数用来控制结果字符串里面的间距。如果是一个数字，则在字符串化时每一个级别会上一级别缩进多这个数字的空格；如果是一个字符串，则每一级别会比上一级别多缩进该字符串

console.log(JSON.stringify({ name: 'jack' }, null, 2));
// {
//   "name": "jack"
// }

JSON.parse()

MDN：JSON.parse()方法用来解析JSON字符串，构造由字符串描述的JavaScript的值或对象。提供可选的reviver函数用以在返回之前对所得到的对象执行变换

语法

JSON.parse(text[, reviver])

• text：要被解析成JavaScript值的字符串
• reviver：转换器，如果传入该参数，可以用来修改解析生成的原始值，调用时机在parse函数返回之前

返回值

object类型，对应给定json文本的对象/值

console.log(JSON.parse('{}'));
console.log(JSON.parse('{"name": "jack"}'))
const obj = JSON.parse('{"name": "jack"}')
console.log(obj.name);
// 输出
// {}
// { name: 'jack' }
// jack

reviver函数

如果指定了reviver函数，则解析出的JavaScript值会经过一次转换后才将被最终返回

const obj = JSON.parse('{"name": "jack"}',function(key,value){
  if(key === '') {
    return value
  }      
  return 'change-'+value
})
console.log(obj.name); //change-jack