17370845950

JavaScript操作JSON需谨慎使用JSON.parse()和JSON.stringify()：前者严格校验双引号、禁止单引号/注释/尾逗号，后者会忽略undefined/function/Symbol、转NaN/Infinity为null、序列化Date为ISO字符串，且循环引用直接报错；推荐用try...catch包裹parse，用reviver/replacer定制解析与序列化逻辑。

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 字符串（如 "2025-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": "2025-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，或先用正则/判断预处理

不复杂但容易忽略。