javascriptJSON如何解析_怎样与字符串相互转换【教程】

JSON.parse()和JSON.stringify()是唯一安全标准的转换方式;前者因非法JSON(如单引号、尾逗号)报错,需校验并预处理;后者忽略函数/undefined/Symbol、不支持循环引用,Date需手动还原;前后端交互须注意类型、编码及空响应处理。

JSON.parse() 和 JSON.stringify() 是唯一安全、标准的转换方式,别用 eval 或 new Function。

JSON.parse() 解析字符串时为什么报错?

常见错误是传入了非法 JSON 字符串——比如单引号、尾逗号、undefined、注释、函数等,这些都不符合 JSON 规范。

  • 合法:"{\"name\":\"Alice\",\"age\":30}"(双引号、无逗号结尾)
  • 非法:"{'name':'Alice'}"(单引号)、"{name:'Alice'}"(键名没引号)、"{\"age\":30,}"(尾逗号)
  • 遇到 SyntaxError: Unexpected token,先用在线 JSON 校验器(如 jsonlint.com)粘贴原始字符串检查
  • 后端返回数据含 HTML 实体或转义不一致时,需先用 decodeURIComponent() 或正则预处理,再调 JSON.parse()

JSON.stringify() 为什么丢失数据或抛异常?

它会静默忽略函数、undefined、Symbol 类型字段,且无法序列化循环引用对象——直接抛 TypeError: Converting circular structure to JSON

  • 遇到循环引用,可用自定义 replacer 函数检测并替换,例如跳过或标记为 "[circular]"
  • undefined 在对象属性中被删掉,在数组中变成 null(如 JSON.stringify([1, undefined, 3])"[1,null,3]"
  • 想保留格式或缩进,传第二个参数 null 和第三个参数空格数:JSON.stringify(obj, null, 2)
  • Date 对象会被转成 ISO 字符串,但反向 JSON.parse() 不会自动还原为 Date——得手动 new Date()

和后端交互时要注意什么?

前后端 JSON 边界常出问题,不是语法错,而是语义错:比如数字被当字符串传、null 被忽略、时间格式不统一。

  • 发送前确认字段类型:JSON.stringify({id: Number(id), active: Boolean(active)}),避免字符串 "0" 或 "false" 被后端误判
  • 接收响应后,别直接信任 res.data 是对象——先 typeof res.data === 'string' 再决定是否 JSON.parse()
  • fetch / axios 默认不自动解析 JSON 响应体,需显式调 response.json();若接口返回 text/plain 类型的 JSON 字符串,也得手动 parse
  • 服务端返回 204 No Content 时 body 为空,response.json() 会报错,要先判断 response.bodyUsed 或状态码

最易被忽略的是:JSON 只支持 UTF-8 编码,任何非 UTF-8 字节流(比如 GBK 响应)在解析前必须先转码,否则中文变乱码或直接 SyntaxError。浏览器环境通常自动处理,但 Node.js 的 http 模块或某些代理层可能需要手动 iconv-lite.decode(buf, 'gbk')