JSON.stringify 竟然还能这样用?

JSON.stringify 这个 API 想必你们都用过,能够帮助咱们将数据解析成字符串类型,以下的例子:数组

let obj = {
    name: 'lxcan',
    age: 18,
    hobby: 'sleep',
    money: null
};
JSON.stringify(obj);
// '{"name":"lxcan","age":18,"hobby":"sleep","money":null}'

想必这样的写法你们都知道,可是其实 JSON.stringify 总共接受三个参数。函数

第二个参数能够传入一个数组或者函数。code

先来看下传入数组结果会是什么?字符串

// 第二个参数传入一个数组
JSON.stringify(obj, ['name', 'age']);
// '{"name":"lxcan","age":18}'

能够看到,当传入数组的时候,只有数组内的属性名才会被正常序列化。string

那么当第二个参数传入函数会是什么呢?序列化

// 第二个参数传入一个函数
let obj1 = {
    name: new Set([1])
};
JSON.stringify(obj1, (key, value) => {
  return value instanceof Set ? [...value] : value
});
// 正常序列化是 "{"name":{}}"
// 例子中的输出为 "{"name":[1]}"
// 第二个参数传入一个函数
let obj2 = {
    lxc: new Map([['name', 'lxcan'], ['age', 18]])
};
JSON.stringify(obj2, (key, value) => {
  return value instanceof Map ? [...value] : value
});
// 正常序列化是 "{"lxc":{}}"
// 例子中的输出为 "{"lxc":[["name","lxcan"],["age",18]]}"

咱们都知道 JSON.stringify 是不能处理某些值的,就好比例子中的 Set/Map 类型的值就不能正常序列化。可是其实咱们能够经过传入函数的方式帮助咱们将 Set/Map 类型的值转换为数组类型,从而使得数据可以被正常序列化。数据

第三个参数能够传入数字或者字符串类型,该参数用于美化输出。正常来讲输出的结果都是一行文本,在数据量小的时候阅读起来没啥压力,可是当数据量庞大的时候就会增长阅读难度。这个参数在这种时候就很是有用。co

// 第三个参数传入数字
JSON.stringify(obj, null, 2);
// {
//   "name": "lxcan",
//   "age": 18,
//   "hobby": "sleep",
//   "money": null
// }

当传入数字时,每一个属性都会换行而且带有缩进空格。字符

// 第三个参数传入字符串
JSON.stringify(obj, null, '--');
// {
// --"name": "lxcan",
// --"age": 18,
// --"hobby": "sleep",
// --"money": null
// }

当传入字符串时,每一个属性照样都会换行而且在开头加上你传入的字符串。gif

以上就是本篇文章的内容了,虽然这单纯属于 API 范畴的知识,可是大部分同窗应该并不知道 JSON.stringify 还拥有这样的能力。

相关文章
相关标签/搜索