JavaScript处理JSON的实用技巧与避坑指南

JavaScript 中的 JSON 操作远不止简单的 `JSON.parse()` 和 `JSON.stringify()` 调用——看似便捷的 API 背后潜藏着诸多“静默陷阱”：非法字符导致解析崩溃、单引号或尾逗号引发语法错误、undefined/function/Symbol 被悄然丢弃、Date 自动转为字符串而丢失类型、NaN/Infinity 被强制映射为 null，更致命的是循环引用会直接抛错；掌握 try...catch 防御性解析、巧用 reviver/replacer 定制数据转换逻辑、识别并绕过非标准类型与双重编码等常见坑点，才能真正安全、精准地驾驭 JSON 在前后端通信与状态管理中的关键角色。

JavaScript 中操作 JSON 主要靠 JSON.parse() 和 JSON.stringify()，它们看似简单，但细节决定成败——比如非法字符、循环引用、特殊值处理、日期格式丢失等，都可能让程序静默失败或产生意外结果。

JSON.parse：不只是“转对象”，还要防报错

JSON.parse() 把符合 JSON 格式的字符串转成 JavaScript 值（对象、数组、字符串、数字、布尔或 null）。但它对输入极其严格：

• 必须是双引号包裹的字符串，单引号、未引号的 key、尾逗号（trailing comma）、注释都会报 SyntaxError
• 不能解析 undefined、function、Symbol、NaN、Infinity —— 这些在 JSON 标准中根本不存在
• 推荐加 try...catch 包裹，尤其处理用户输入或网络响应时

示例：

try {
  const obj = JSON.parse('{"name": "张三", "age": 25}');
} catch (e) {
  console.error('解析失败：', e.message); // 避免崩溃
}

JSON.stringify：会“丢东西”，不是所有值都能转

JSON.stringify() 把 JavaScript 值序列化为 JSON 字符串，但它有明确的过滤规则：

• undefined、function、Symbol 类型的属性会被**完全忽略**（对象中不出现，数组中变成 null）
• NaN 和 Infinity 被转为 null
• 日期对象（Date）会调用 .toJSON() 方法，默认输出 ISO 字符串（如 "2024-05-10T08:30:00.000Z"）
• 循环引用对象会直接抛出 TypeError: Converting circular structure to JSON

示例：

const data = {
  name: '李四',
  age: null,
  birth: new Date('1990-01-01'),
  sayHi: function() {},
  meta: undefined
};
console.log(JSON.stringify(data));
// → {"name":"李四","age":null,"birth":"1990-01-01T00:00:00.000Z"}

sayHi 和 meta 消失了，birth 变成了字符串。

进阶技巧：reviver 和 replacer 参数很实用

JSON.parse(str, reviver) 的 reviver 是个函数，能在解析过程中逐层处理每个键值对，常用于类型恢复或数据清洗：

const json = '{"timestamp": "2024-05-10T12:00:00Z", "count": 42}';
const obj = JSON.parse(json, (key, value) => {
  if (key === 'timestamp') return new Date(value);
  return value;
});
// obj.timestamp 是 Date 实例，不再是字符串

JSON.stringify(obj, replacer, space) 的 replacer 可以是数组（指定保留哪些 key）或函数（自定义序列化逻辑）：

const user = { id: 123, token: 'abc123', name: '王五' };
JSON.stringify(user, ['id', 'name']); 
// → {"id":123,"name":"王五"}，token 被过滤掉

JSON.stringify(user, (k, v) => k === 'token' ? undefined : v);
// 同样排除 token

常见陷阱与绕过方案

遇到这些情况别硬扛：

• 循环引用：用第三方库（如 flatted）或手动剥离引用，或改用 structuredClone()（现代环境）做深拷贝再序列化
• Map/Set/BigInt/RegExp 等非标准类型：需在 replacer 中显式转换，例如 typeof v === 'bigint' ? v.toString() + 'n' : v
• 后端返回的 JSON 字符串被双重编码（如 "{\"name\":\"张三\"}"）：需多次 JSON.parse，或先用正则/判断预处理

不复杂但容易忽略。

今天关于《JavaScript处理JSON的实用技巧与避坑指南》的内容介绍就到此结束，如果有什么疑问或者建议，可以在golang学习网公众号下多多回复交流；文中若有不正之处，也希望回复留言以告知！