当前位置：首页 > 文章列表 > 文章 > 前端 > JavaScript如何解析JSON_数据交换格式你熟悉吗

JavaScript如何解析JSON_数据交换格式你熟悉吗

2026-05-06 08:39:35 0浏览收藏

今日不肯埋头，明日何以抬头！每日一句努力自己的话哈哈~哈喽，今天我将给大家带来一篇《JavaScript如何解析JSON_数据交换格式你熟悉吗》，主要内容是讲解等等，感兴趣的朋友可以收藏或者有更好的建议在评论提出，我都会认真看的！大家一起进步，一起学习！

JSON.parse()是JavaScript解析JSON的核心函数，需传入合法双引号字符串，禁用单引号、尾逗号、undefined等；须用try...catch安全处理，reviver参数可过滤字段或转换类型。

JavaScript 解析 JSON 数据交换格式，核心就一个函数：JSON.parse()。它不是万能的，但只要数据合法、上下文明确，就是最直接可靠的解析方式。

为什么 `JSON.parse()` 会报错：常见输入陷阱

报错不是函数有问题，而是传入的字符串不符合 JSON 规范。浏览器和 Node.js 都严格遵循标准，不接受单引号、尾逗号、undefined、注释或变量引用。

JSON.parse("{'name': 'Alice'}") → 报错：单引号不合法，必须用双引号
JSON.parse('{"age": 25,}') → 报错：末尾逗号（trailing comma）不允许
JSON.parse('{"value": undefined}') → 报错：undefined 不是 JSON 值类型（只支持 null、number、string、boolean、array、object）
JSON.parse("{name: 'Bob'}") → 报错：key 必须加双引号

如何安全解析不确定来源的 JSON 字符串

后端返回、localStorage 读取、fetch 响应体都可能出问题。不能假设一定成功，必须包裹在 try...catch 中，并区分错误类型。

function safeParse(jsonStr) {
  try {
    return JSON.parse(jsonStr);
  } catch (err) {
    if (err instanceof SyntaxError) {
      console.error('JSON 格式错误:', err.message);
      return null;
    }
    throw err; // 其他错误（如内存溢出）不应静默吞掉
  }
}

不要用 typeof JSON.parse(...) === 'object' 判断是否成功——失败时会直接抛异常，根本不会返回
避免在 catch 里返回空对象 {}：掩盖了原始问题，后续逻辑可能误判为“有数据”
如果需要默认值，应在解析成功后再做合并，例如 { ...defaultConfig, ...safeParse(str) }

`JSON.parse()` 的第二个参数：reviver 函数的实际用途

这个可选参数常被忽略，但它能解决几个真实痛点：过滤字段、转换日期字符串、修复数值精度。

const json = '{"created":"2023-10-05T12:00:00Z","count":9999999999999999}';
const data = JSON.parse(json, (key, value) => {
  if (key === 'created') return new Date(value);
  if (key === 'count' && typeof value === 'number') {
    // 防止 JS number 精度丢失（超 2^53）
    return String(value); // 转成字符串保留完整数字
  }
  return value;
});