JSON（JavaScript Object Notation）是现代Web开发中最基础、最普适的数据交换格式，几乎所有前端、后端、移动端、大模型API、配置文件都离不开它。2026年了，它依然是“轻量级数据交换神器”的地位无人撼动。
下面从零基础到吃透，按实际开发中最常用的路径组织内容（前端视角 + 后端视角 + 高级/坑点/最佳实践）。建议你边看边在浏览器控制台 / Node.js / Python / Go 等环境里敲代码验证。
1. JSON 到底是什么？（30秒速览）
- 一种纯文本格式，用来描述结构化数据
- 基于 JavaScript 对象字面量语法，但更严格
- 语言无关：前端 JS、后端 Java/Python/Go/PHP/Rust、大模型的工具调用、配置文件（package.json、tsconfig.json、.vscode/settings.json）、API 响应……到处都是它
- 官网标准（永恒不变）：https://www.json.org/json-zh.html
核心口诀：“键必须双引号，值只有6种类型，其他一律非法”
2. JSON 支持的6种值类型（必须死记）
| 类型 | 示例 | JS 中的对应类型 | 注意事项 / 常见错误 |
|---|---|---|---|
| 字符串 | "hello"、"中"、"\" \\ \n" | string | 必须双引号，单引号非法；转义字符必背 |
| 数字 | 42、-3.14、1e-10 | number | 无八进制/十六进制字面量；NaN/Infinity/undefined 非法 |
| 布尔 | true / false | boolean | 必须小写，True/False 非法 |
| null | null | null | 唯一表示“无值”的方式 |
| 数组 | []、[1, "a", true, null] | Array | 有序，可混合类型 |
| 对象 | {}、{"name":"张三","age":28} | Object | 无序键值对，键必须双引号 |
最常见新手错误Top 5（2026年还在犯的）：
- 写成
{'name': '李四'}→ 键用了单引号 → 非法JSON - 最后多一个逗号：
{"a":1,}→ 部分老解析器会报错（现代浏览器/Node大多宽容，但不推荐） - 注释：
{"id":1 /* 这是ID */}→ JSON标准完全不支持注释 undefined、NaN、Infinity直接写 → 非法- 函数、Date、正则、Symbol 等 JS 类型 → 直接 stringify 出来是
{}或报错
3. 前端必会：JSON 与 JavaScript 的来回转换
// 字符串 → JS 值（最常用：fetch后解析响应）
const jsonStr = '{"name":"小明","age":18,"isVip":true,"skills":["JS","React"]}';
const data = JSON.parse(jsonStr); // 成功 → 对象
console.log(data.name); // "小明"
// 安全版本（防XSS/恶意JSON）
try {
const safeData = JSON.parse(untrustedJsonStr);
} catch (e) {
console.error("非法JSON", e);
}
// JS 值 → JSON 字符串（发给后端 / localStorage / WebSocket）
const obj = {
name: "小红",
age: 20,
birthday: new Date("2005-01-01"), // 注意！
sayHi: () => console.log("hi") // 注意！
};
const json = JSON.stringify(obj, null, 2); // 带缩进，便于调试
console.log(json);
/* 输出：
{
"name": "小红",
"age": 20,
"birthday": "2005-01-01T00:00:00.000Z" // Date 被转成 ISO 字符串
}
*/
// 第二个参数 replacer（过滤/转换）
JSON.stringify(obj, ["name", "age"]); // 只保留 name 和 age
JSON.stringify(obj, (k, v) => k === "sayHi" ? undefined : v); // 去掉函数
// 第三个参数 space（缩进空格数或字符串）
JSON.stringify(obj, null, 4); // 4个空格
JSON.stringify(obj, null, "\t"); // Tab前端高频场景：
- fetch / axios 响应
.json()→ 自动 parse - localStorage.setItem(‘user’, JSON.stringify(user))
- WebSocket / SSE / GraphQL 响应基本都是 JSON
4. 后端必会：JSON 的序列化/反序列化（各语言对比）
| 语言 | 序列化（对象→字符串） | 反序列化（字符串→对象） | 常用库 / 注意点 |
|---|---|---|---|
| Node.js | JSON.stringify() | JSON.parse() | 原生，性能好 |
| Python | json.dumps(obj, ensure_ascii=False) | json.loads(s) | 默认 ascii 转义中文，加 ensure_ascii=False |
| Go | json.Marshal(v) | json.Unmarshal(data, &v) | 结构体字段需 json:"field_name" tag |
| Java | Jackson / Gson / Fastjson | 同上 | Spring Boot 默认 Jackson |
| C# | JsonSerializer.Serialize(obj) | JsonSerializer.Deserialize<T>(json) | System.Text.Json（.NET Core+）或 Newtonsoft |
后端常见坑：
- 大数字精度丢失（JS Number 是 IEEE 754 双精度，超过 2⁵³-1 就丢精度）→ 用字符串传 ID
- 时区问题：Date 序列化后是 UTC，接收端要小心
- 循环引用：
obj.self = obj→ stringify 直接报错 - 二进制/文件：JSON 不适合，改用 base64 或 multipart
5. 高级 & 最佳实践（2026年真实项目级别）
- JSON Schema（强烈推荐）
- 描述 JSON 的结构，像 TypeScript 接口
- 用 ajv / zod（JS）、pydantic（Python）校验
- OpenAPI / FastAPI / tRPC 都在用
- 大 JSON 优化
- 压缩：Gzip / Brotli（HTTP 层）
- 精简字段：后端只返回前端需要的字段（GraphQL 就是为此而生）
- 分页 / 流式传输（大模型 response 常用）
- 安全
- 永远不要直接把用户输入当 JSON 拼接（XSS / JSONP 劫持）
- 后端反序列化时校验类型和范围
- 避免返回敏感字段（password、token）
- 现代替代/补充（了解但不取代 JSON）
- JSON5：允许单引号、尾逗号、无引号键、注释（配置文件常用）
- TOML / YAML：更适合人类写配置
- Protocol Buffers / Avro / MessagePack：性能敏感场景（gRPC）
6. 练习题（建议全部手写验证）
- 写一个合法 JSON：包含嵌套对象 + 数组 + 中文 + 转义字符
- 把下面非法字符串改成合法 JSON：
{name: '王五', age: 25,} - 用 JS 实现一个函数：把任意对象安全转为 JSON（过滤函数、undefined、循环引用）
- 后端视角：设计一个 User 接口的 JSON Schema（包含必填/选填、枚举、格式校验）
掌握 JSON 后，你会发现：90% 的前后端协作、本地调试、API 联调，其实就是在和 JSON 打交道。
有哪一部分想再深入？比如 JSON Schema 实战、Go/Python 具体代码、常见大厂面试 JSON 题？
