JSON.stringify和JSON.parse参数详解

JSON.stringify()

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

JSON.stringify(value[, replacer [, space]])

参数：

value，将要序列化成 一个JSON 字符串的值。

replacer 可选，如果该参数是一个函数，则在序列化过程中，被序列化的值的每个属性都会经过该函数的转换和处理；如果该参数是一个数组，则只有包含在这个数组中的属性名才会被序列化到最终的 JSON 字符串中；如果该参数为null或者未提供，则对象所有的属性都会被序列化；如果是数组相当于是对序列化数据的一个筛选过滤，函数就是对原数据的处理。

space 可选，指定缩进用的空白字符串，用于美化输出；如果参数是个数字，它代表有多少的空格；上限为10。该值若小于1，则意味着没有空格；如果该参数为字符串(字符串的前十个字母)，该字符串将被作为空格；如果该参数没有提供（或者为null）将没有空格。

返回值 ：一个表示给定值的JSON字符串。

replacer参数

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

• 如果返回一个 Number, 转换成相应的字符串被添加入JSON字符串。
• 如果返回一个 String, 该字符串作为属性值被添加入JSON。
• 如果返回一个 Boolean, "true" 或者 "false"被作为属性值被添加入JSON字符串。
• 如果返回任何其他对象，该对象递归地序列化成JSON字符串，对每个属性调用replacer方法。除非该对象是一个函数，这种情况将不会被序列化成JSON字符串。
• 如果返回undefined，该属性值不会在JSON字符串中输出。

注意: 不能用replacer方法，从数组中移除值(values)，如若返回undefined或者一个函数，将会被null取代。

例子(function)

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}.

const students = [
  {
    name: 'akira',
    score: 100,
  }, {
    name: 'John',
    score: 60,
  }, {
    name: 'Jane',
    score: 90,
  }
];

function replacer(key, value) {
  if(key === 'score') {
    if (value === 100) {
      return 'S';
    } else if(value >= 90) {
      return 'A';
    } else if(value >= 70) {
      return 'B';
    } else if(value >= 50) {
      return 'C';
    } else {
      return 'E';
    }
  }
  return value;
}

JSON.stringify(students,replacer,4);
//上面的代码，我们通过replacer将成绩从百分制替换为SABCE的成绩。
/*
"[
    {
        "name": "akira",
        "score": "S"
    },
    {
        "name": "John",
        "score": "C"
    },
    {
        "name": "Jane",
        "score": "A"
    }
]"
*/

例子(array)

如果replacer是一个数组，数组的值代表将被序列化成JSON字符串的属性名。并且是递归的操作

JSON.stringify(foo, ['week', 'month']);  
// '{"week":45,"month":7}', 只保留“week”和“month”属性值。

const students = [
  {
    name: 'akira',
    score: 100,
  }, {
    name: 'John',
    score: 60,
  }, {
    name: 'Jane',
    score: 90,
  }
];

JSON.stringify(students,["name"],4);
/*
"[
    {
        "name": "akira"
    },
    {
        "name": "John"
    },
    {
        "name": "Jane"
    }
]"
*/

space 参数

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

JSON.stringify({ a: 2 }, null, " ");   // '{\n "a": 2\n}'

使用制表符（\t）来缩进：

JSON.stringify({ uno: 1, dos : 2 }, null, '\t')
// '{            \
//     "uno": 1, \
//     "dos": 2  \
// }'

 

JSON.parse()

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

语法：JSON.parse(text[, reviver])

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

返回值：Object类型, 对应给定JSON文本的对象/值。

例子：

JSON.parse('{"p": 5}', function (k, v) {
    if(k === '') return v;     // 如果到了最顶层，则直接返回属性值，
    return v * 2;              // 否则将属性值变为原来的 2 倍。
});                            // { p: 10 }

JSON.parse('{"1": 1, "2": 2,"3": {"4": 4, "5": {"6": 6}}}', function (k, v) {
    console.log(k); // 输出当前的属性名，从而得知遍历顺序是从内向外的，
                    // 最后一个属性名会是个空字符串。
    return v;       // 返回原始属性值，相当于没有传递 reviver 参数。
});


const str = '{"result":true, "count":42}';

const result = JSON.parse(str, (key, value) => {
  if(typeof value === 'number') return value * 2;
  return value;
});

console.log(result); // {result: true, count: 84}