Unicode 转义实战:中文与 \uXXXX 互转,看懂 JSON 里的乱码

接口返回一段 "name":"张伟",前端同事问这是谁。看着像乱码,其实它一点没坏,只是把中文换成了 Unicode 转义。这篇把转义这件事讲透:中文怎么变成 \uXXXX,又怎么还原回来,以及在 JSON、JS 源码、配置文件里分别该选哪种写法。

一个具体例子:你好 = 你好

先看最小的转换。"你好"两个字,码点分别是 U+4F60 和 U+597D,转成 JavaScript/JSON 风格就是 你好。反过来,把 你好 粘到解码侧,拿回来的就是"你好",一个字都不差。

单字也一样:"你"的码点是 U+4F60,JS 转义是 你,ES6 码点写法是 \u{4f60},HTML 十进制实体是 你,十六进制实体是 你,CSS 转义是 \4f60 加一个空格。这几种里随便挑一种喂给解码器,都能还原成"你"。绝大多数汉字都待在基本多文种平面里,所以一个四位的 \uXXXX 就够装。

可以直接打开 /zh/t/unicode-escape-converter/ 把"你好"粘进去试,左边出 你好,右边切方向就还原。

JSON 里的"乱码"根本不是乱码

很多人第一次见 张伟 会以为编码错了。其实这是合法 JSON,标准允许把任意非 ASCII 字符写成 \u 转义。很多后端框架默认开启 ensure_ascii,于是"张伟"被原样转成了 张伟,传输时全程只走 ASCII 字节,到了浏览器再由 JSON.parse 还原成中文。

所以遇到接口里一串 \u 不用慌,它和原文是等价的。把整段响应丢进解码侧,立刻读出可读文字,不用再对着十六进制猜。如果你想看每个码点到底是什么字符、属于哪个区段,可以配合 /zh/t/unicode-character-inspector/ 逐字拆开看。

emoji 为什么会拆成两段

汉字好办,emoji 有个坑。😀 的码点是 U+1F600,超过了 U+FFFF,而一个 \uXXXX 只能放四位十六进制,最多到 U+FFFF。JavaScript 字符串是 UTF-16,只能把它存成两个码元,叫代理对:😀。这就是一个 emoji 在 JS/JSON 风格里显示成两段转义的原因,它没坏。

ES6 的 \u{1f600} 用花括号,里面最多放六位,所以一段就能写完整个 emoji,读起来也清爽。要兼容老 JSON 就用 \uXXXX,在现代 JS 里图好读就用 \u{...}。解码时两种都认,代理对会自动拼回一个 😀。

哪种风格用在哪

转义不是只有一种写法,用错地方它就会以原始文字的样子露在页面上:

• \uXXXX 和 \u{...}:用在 JavaScript、JSON 和大多数配置文件里,由语言解析器解释。
• HTML 实体 😀 或 😀:用在 HTML 标记和邮件模板里,浏览器渲染成真正的字符。
• CSS 转义 \1f600:只用在样式表,通常配合 content 属性。

判断逻辑很简单:看这段文字最终交给谁解析。交给 JS 引擎就用 \u,交给浏览器排版就用 &#…;,交给 CSS 就用反斜杠加码点。需要在 HTML 实体上多做几种转换,可以用 /zh/t/html-entities-encoder/;如果是给字符串做更通用的转义和反转义,/zh/t/string-escape-tool/ 更顺手。

我自己踩过的坑

我以前写过一个简易转义函数,用 str[i] 一个一个取字符再调 charCodeAt,本地中文测着没问题,直到有人输入了 🎉。结果输出里冒出两个残缺的代理码,粘回去渲染成方块。原因就是 str[i] 和 charCodeAt 返回的是单个 UTF-16 码元,把一个 emoji 切成了两半。后来换成 codePointAt 加 for…of 遍历,🎉 才被当成一个完整字符处理。如果你也要手写转义,记住按码点走,别按下标走。

还有两个常见错误

一是给 U+FFFF 以上的字符直接套一个 \uXXXX。比如想写 😀 却写成单个四位转义,解析出来根本不是 emoji,因为 \uXXXX 只读四位。辅助平面的字符要么用代理对,要么用 \u{1f600}。

二是混用风格。把 😀 粘进 JS 字符串,它就是一串原文字符,不会变成 emoji;把 \u{1f600} 粘进 HTML 同理。转义风格必须和它所在的地方对上。

小结

中文转 \uXXXX 本质就是把每个字符换成它的码点十六进制,还原就是反着读一遍。JSON 里的 \u 串不是乱码,emoji 拆两段是 UTF-16 的正常行为,选哪种风格只看最终由谁解析。按码点遍历、风格别混用,这两条记住,转义就不会再咬你。把文本和 \uXXXX 互转,直接用 /zh/t/unicode-escape-converter/,编码解码都在浏览器本地跑,不上传任何内容。

---

Made by Toolora · Updated 2026-06-13