JavaScript操作JSON主要靠JSON.stringify()和JSON.parse():前者将对象序列化为字符串,支持过滤字段和格式化输出;后者将字符串解析为对象,支持reviver函数处理值;二者均不支持函数、undefined、Symbol等类型,需注意Date转换、循环引用及大数字精度问题。

JavaScript 操作 JSON 主要靠两个内置方法:JSON.stringify() 用于序列化(把对象转成 JSON 字符串),JSON.parse() 用于解析(把 JSON 字符串转回 JavaScript 值)。它们不支持函数、undefined、Symbol、Date 对象(直接转会丢失或报错),用起来简单但细节要注意。
JSON.stringify():把数据转成 JSON 字符串
这个方法接受三个参数:要转换的值、可选的替换函数或数组(用于过滤/修改键值)、可选的缩进空格数(用于美化输出)。
- 基础用法:
JSON.stringify({name: "张三", age: 25})→'{"name":"张三","age":25}' - 过滤字段:传入数组,如
JSON.stringify(obj, ["name", "city"])只保留 name 和 city 字段 -
格式化输出:加第三个参数,比如
JSON.stringify(obj, null, 2)会换行+2空格缩进,方便阅读 - 注意:Date 对象会被转成 ISO 字符串,
new Date()→"2024-05-10T08:30:00.000Z";函数和 undefined 会被忽略;NaN 和 Infinity 转为 null
JSON.parse():把 JSON 字符串还原为 JavaScript 值
这个方法接收一个 JSON 字符串和一个可选的 reviver 函数(用于在解析过程中处理每个键值对)。
- 基础用法:
JSON.parse('{"name":"李四","age":30}')→ 返回对象{name: "李四", age: 30} - 安全校验:字符串必须是严格 JSON 格式(双引号、无尾逗号、无注释),否则抛
SyntaxError。建议用 try/catch 包裹 - reviver 示例:可以用来把时间字符串自动转成 Date 对象:
JSON.parse(jsonStr, (key, value) => key === 'time' ? new Date(value) : value)
常见陷阱与绕过方式
原生 JSON API 不处理函数、正则、Map/Set、undefined 等类型,遇到这些需要手动预处理或使用第三方库(如 flatted 或自定义序列化逻辑)。
立即学习“Java免费学习笔记(深入)”;
- Date:序列化前转成字符串,解析后用 reviver 还原
- undefined / 函数:提前用
JSON.stringify()的 replacer 过滤掉,或替换成 null - 循环引用:直接调用会报错,需先用
structuredClone()(现代浏览器)或自定义克隆逻辑避免 - 大数字精度丢失:JSON 不区分 number 和 bigint,
BigInt(123n)无法直接序列化,需转成字符串再存
实用小技巧
日常开发中,结合 localStorage、fetch 请求体或响应处理时,JSON 转换很频繁,几个顺手写法值得记住:
- 安全解析封装:
const safeParse = (str) => { try { return JSON.parse(str); } catch { return null; } }; - 深拷贝替代方案:
const clone = obj => JSON.parse(JSON.stringify(obj));(仅适用于纯数据对象,不含函数/日期等) - 调试打印 JSON:
console.log(JSON.stringify(data, null, 2));比直接 log 更清晰










