JSON.stringify参数详解与实用技巧

本文深入解析了JavaScript中JSON.stringify()的核心用法与实用技巧，重点讲解其三个参数——value（待序列化值）、replacer（灵活过滤或转换字段的数组或函数）和space（控制输出格式化的缩进），同时对比说明JSON.parse()的严格语法要求与reviver回调功能；文章不仅通过正误示例厘清常见陷阱（如单引号、尾逗号、undefined/function/Symbol忽略及循环引用报错），还分享了格式化调试、安全数据交换和简易深拷贝等实战技巧，帮助开发者高效、可靠地处理前后端数据交互。

JavaScript中解析JSON用 JSON.parse()，序列化对象用 JSON.stringify()；后者有三个参数，但常用的是前两个。

如何正确解析JSON字符串

JSON.parse() 用于把符合JSON格式的字符串转成JavaScript值（对象、数组、字符串、数字等）。注意：字符串必须是严格JSON格式——键名和字符串值必须用双引号，不能有末尾逗号，不能有单引号或注释。

• ✅ 正确：JSON.parse('{"name": "张三", "age": 25}')
• ❌ 报错：JSON.parse("{'name': '张三'}")（单引号不合法）
• ❌ 报错：JSON.parse('{"name": "张三",}') （尾逗号非法）

可选第二个参数是 reviver函数，用于在解析过程中逐层处理每个键值对，比如过滤字段、转换日期字符串：

const data = '{"name":"李四","birth":"2000-01-01"}';
JSON.parse(data, (key, value) => {
  if (key === 'birth') return new Date(value);
  return value;
}); // { name: "李四", birth: Date object }

JSON.stringify() 的三个参数详解

JSON.stringify(value, replacer, space)

• value：要序列化的值（对象、数组、基本类型等）
• replacer：可选，控制哪些属性被序列化。可以是数组（指定白名单键名）或函数（类似parse的reviver）
• space：可选，用于美化输出。可以是数字（缩进空格数）或字符串（如'  '）

常见用法示例：

// 只保留指定字段
JSON.stringify({a: 1, b: 2, c: 3}, ['a', 'c']); // '{"a":1,"c":3}'
// 用函数过滤/修改值
JSON.stringify({x: 1, y: 2}, (k, v) => k === 'y' ? undefined : v * 2); // '{"x":2}'
// 格式化输出
JSON.stringify({a: 1, b: {c: 2}}, null, 2);
// 输出：
// {
//   "a": 1,
//   "b": {
//     "c": 2
//   }
// }

容易踩的坑

JSON.stringify 会忽略：undefined、function、Symbol 类型的属性值，以及循环引用的对象（直接报错）。

• JSON.stringify({f() {}, x: undefined, s: Symbol('s')}) → {}
• const obj = {}; obj.self = obj; JSON.stringify(obj) → TypeError: Converting circular structure to JSON

遇到循环引用可用第三方库（如 flatted）或手动预处理；需要保留函数可先转为字符串再存，但要注意执行安全。

实用小技巧

调试时快速查看结构，加 space=2 更清晰；想深拷贝简单对象，可用 JSON.parse(JSON.stringify(obj))（仅限纯数据，不含函数、Date、RegExp等）。

基本上就这些。用熟 parse 和 stringify 的参数，处理前后端数据交换就顺多了。

理论要掌握，实操不能落！以上关于《JSON.stringify参数详解与实用技巧》的详细介绍，大家都掌握了吧！如果想要继续提升自己的能力，那么就来关注golang学习网公众号吧！