本文目录
什么是 JSON5?
JSON5 是 JSON 的超集,它添加了受 ECMAScript 5.1 语法启发的特性。其设计初衷是让 JSON 在配置文件以及需要人工编写和阅读的场景中更加友好。每一份有效的 JSON 文档同时也是有效的 JSON5,但 JSON5 额外支持注释、尾随逗号、无引号键名以及其他便利特性。
JSON5 规范于 2018 年定稿,并在 JavaScript 工具链中被广泛采用。Babel、Next.js 和 Webpack 等构建工具都接受 JSON5 配置文件。当需要与只理解严格 JSON 的系统(如 API、数据库和大多数编程语言)进行互操作时,就需要将 JSON5 转换为标准 JSON。
JSON5 特性详解
JSON5 添加了若干语法扩展,使配置文件更易于编写和维护。
- 注释——允许使用单行(//)和多行(/* */)注释,让配置文件能够自我说明
- 尾随逗号——数组和对象的最后一项后面可以加逗号,从而在添加或删除条目时减少 diff 噪声
- 无引号键名——凡是有效 ECMAScript 标识符的对象键名都无需加引号,让配置更简洁
- 十六进制数字——数值可以写作 0xFF,便于在配置中表示颜色码和位掩码
- 多行字符串——字符串值可以通过反斜杠续行跨越多行,适合表示较长的描述或路径
- 特殊数值——Infinity、-Infinity 和 NaN 在 JSON5 中都是有效的数值字面量
免费试用 —— 无需注册
将 JSON5 转换为 JSON →JSON5 的应用场景
JSON5 主要用于 JavaScript 生态的工具链中,这些场景下的配置文件由开发者编写和维护。
- Babel——.babelrc 和 babel.config.json5 文件支持 JSON5 语法,可为构建配置添加注释
- TypeScript——tsconfig.json 支持注释和尾随逗号等 JSON5 特性(严格来说属于 JSONC)
- Chrome DevTools——网络限速配置及其他设置采用 JSON5 格式
- Next.js——配置文件接受 JSON5,可通过内联文档实现对开发者友好的配置
常见问题解答
浏览器能原生解析 JSON5 吗?
不能。浏览器只通过 JSON.parse() 支持标准 JSON。要在浏览器或 Node.js 应用中解析 JSON5,你需要使用 json5 npm 包。支持 JSON5 的构建工具会在其构建步骤中内部完成解析。
JSON5 和 JSONC 有什么区别?
JSONC(带注释的 JSON)只为 JSON 添加了注释支持。JSON5 则是范围更广的超集,添加了注释、尾随逗号、无引号键名、十六进制数字、多行字符串和特殊数值。TypeScript 的 tsconfig.json 和 VS Code 的 settings.json 使用 JSONC,而 Babel 及其他工具使用完整的 JSON5。
JSON5 和 YAML 是一回事吗?
不是。JSON5 在语法上贴近 JSON,只做了一些人体工学上的小幅增补。YAML 则是一种完全不同的格式,采用基于空白缩进的结构、锚点以及更多特性。JSON5 更容易转换为 JSON,因为它是严格的超集。而 YAML 转 JSON 可能会有损,因为 YAML 支持一些 JSON 不具备的数据类型。