首页 > 文章 > 前端

什么是json_javascript中如何解析和生成？

时间：2025-12-22 08:45:14 128浏览收藏

推广推荐

支持 PC / 移动端，安全直达

本篇文章向大家介绍《什么是json_javascript中如何解析和生成？》，主要包括，具有一定的参考价值，需要的朋友可以参考一下。

JSON是轻量级数据交换格式，键名须双引号、禁末尾逗号、不支持函数/undefined/Symbol等；用JSON.parse()解析字符串为JS值，JSON.stringify()将JS值转为JSON字符串。

什么是json_javascript中如何解析和生成？

JSON（JavaScript Object Notation）是一种轻量级的数据交换格式，语法简洁、易读易写，也便于机器解析和生成。它不是 JavaScript 专属，但和 JS 对象字面量高度相似，因此在 JavaScript 中原生支持解析和生成。

JSON 和 JS 对象的区别

虽然长得像，但 JSON 是纯字符串格式，有严格规则：键名必须用双引号包裹，不能有单引号或不加引号；不允许末尾逗号；不能包含函数、undefined、Symbol、Date 实例、RegExp 等 JS 特有值；null 是合法的。

例如，这个是合法 JSON 字符串：

{"name": "张三", "age": 25, "isStudent": false}

而下面这些不是合法 JSON：

{'name': '张三'}（单引号 → 错误）
{name: "张三"}（键没引号 → 错误）
{age: 25,}（末尾逗号 → 错误）
{date: new Date()}（含对象实例 → 不可序列化为 JSON）

用 JSON.parse() 解析 JSON 字符串

把符合 JSON 格式的字符串转成 JS 对象或数组，用 JSON.parse()：

基本用法：JSON.parse('{"x":1,"y":2}') → 返回 {x: 1, y: 2}
带错误处理：必须用 try/catch，因为非法 JSON 会直接抛错
可选第二个参数 reviver 函数，用于在解析过程中转换值（比如把时间字符串转成 Date 对象）

示例：

try {
  const data = JSON.parse('{"time":"2024-06-01"}', (key, value) => {
    if (key === 'time') return new Date(value);
    return value;
  });
  // data.time 是 Date 实例
} catch (e) {
  console.error('解析失败：', e.message);
}

用 JSON.stringify() 生成 JSON 字符串

把 JS 值（对象、数组、字符串、数字、布尔、null）转成 JSON 字符串，用 JSON.stringify()：

基础用法：JSON.stringify({a: 1, b: [2,3]}) → {"a":1,"b":[2,3]}
第二个参数可传 replacer：数组（指定要保留的键）或函数（自定义序列化逻辑）
第三个参数可传空格数或字符串，用于美化输出（如缩进 2 个空格）
注意：undefined、函数、Symbol 会被忽略；NaN 和 Infinity 转为 null；Date 实例调用 toJSON()（即 ISO 字符串）

示例：

const obj = {
  id: 1,
  name: "李四",
  createdAt: new Date(),
  meta: undefined,
  fn: () => {}
};
console.log(JSON.stringify(obj, null, 2));
// 输出（自动忽略 meta 和 fn，日期转为字符串）

常见坑与注意事项

实际开发中容易踩的点：

后端返回的响应体是字符串，但忘了 JSON.parse() 就直接当对象用 → 报错 “xxx is not an object”
fetch 或 axios 默认不自动解析 JSON，需手动调用 .json()（这是 Promise 方法，内部已封装 parse）
循环引用对象（比如 a.b = a）传给 stringify → 抛错 “Converting circular structure to JSON”
想序列化 Map/Set/BigInt/自定义类实例？原生不支持，需自行实现 replacer 或用第三方库（如 flatted、serialize-javascript）

基本上就这些。用好 JSON.parse 和 JSON.stringify，是前端日常处理接口数据最基础也最关键的技能之一。

文中关于的知识介绍，希望对你的学习有所帮助！若是受益匪浅，那就动动鼠标收藏这篇《什么是json_javascript中如何解析和生成？》文章吧，也可关注golang学习网公众号了解相关技术文章。