一个汉字三种编码：UTF-8、GBK、UTF-16 逐字节对比实测-北京尧图网络

「汉」在 UTF-8 里是 E6 B1 89在 GBK 里是 BA BA在 UTF-16LE 里是 49 6C。同一个字三种编码分别是 3 字节、2 字节、2 字节。我把这三个数字摊在同一张表里对了一遍谁多一个字节、谁换了字节序一眼可见。emoji 的差别更大在 UTF-8 里占 4 个字节在 UTF-16 里也是 4 个GBK 干脆编不出来页面上标成 N/A。乱码也不是文件坏了是拿另一种编码去读了同一串字节。成品是一个单文件 index.html双击就能跑不联网不引第三方库。案例目录在这里下载下来直接打开https://atomgit.com/deli007/demo_park/tree/main/codearts-unicode-encoding-lab一、先把默认文本的字节摊开字符Unicode 码位UTF-8 字节UTF-16LE 码元GBK 字节汉U6C49E6 B1 8949 6CBA BA字U5B57E5 AD 9757 5BD7 D6AU00414141 0041U1F600F0 9F 98 803D D8 00 DE不支持表里每一格都是页面打开时当场算的不是我抄的。汉字在 UTF-8 里占 3 字节这就是「一个汉字三个字节」这句话的出处。GBK 只占 2 字节这也是老项目里中文文本普遍更小的原因。字母 A 在三种编码里都是自己UTF-16 为了凑对齐后面补了一个 00。emoji 那行最扎眼GBK 那一格直接写着不支持。二、为什么值得做这个页面乱码是中文开发者绕不开的事但很多人停在了「编码不统一」这句结论上。具体是哪几个字节、被谁读成了什么、为什么正好是「锟斤拷」很少有人讲透。我回想了一下自己踩坑的经历这个问题在三个不同项目里各出现过一次每次都靠搜索救回来。所以它不是一个看完就忘的演示而是有明确检索词的东西UTF-8、GBK、乱码、UTF-16。页面要做的事很窄给我一串字符告诉我它在四种编码下的真实字节。窄的好处是每一项都能验。三、怎么做三种编码三条不同的路UTF-8 和 UTF-16 在浏览器里是原生能力直接调就行。UTF-8 用 TextEncoder 一行拿到字节数组。UTF-16LE 和 UTF-16BE 用 charCodeAt 把每个码元拆成高低字节BE 只是把这两个字节换个顺序。麻烦的是 GBK浏览器只给了 TextDecoder负责解码没有对应的编码器。没有编码器就得自己造一张反查表。我的做法是让解码器反过来工作首字节从 0x81 枚举到 0xFE次字节从 0x40 枚举到 0xFE跳过 0x7F。每组两字节丢进 TextDecoder(‘gbk’) 解一次解得出的字符就跟这两个字节绑在一起。一共试了 23940 组建出 24067 条映射其中 128 条来自 ASCII 单字节。我在页面上掐了时间整张表建完 18.5 毫秒再刷一遍是 17.7 毫秒映射条数两次都是 24067。这个数字是页面上真跑出来的不是估的。四、乱码复现把两次错误解码摆在同一屏左栏的原始字节是 E6 B1 89 E5 AD 97 41 F0 9F 98 80按 GBK 读出来是「姹夊瓧A馃榾」。右栏的原始字节是 BA BA D7 D6 41 3F按 UTF-8 读出来是四个替换字符加一个 A?。同一串「汉字A」换个读法就成了两个不同的怪东西。「锟斤拷」的来历我也在页面上验了一遍。把两个 UTF-8 的替换字符 0xEF 0xBF 0xBD 连起来用 GBK 解正好是「锟斤拷」。单个 EF BF BD 解出来只有一个「锟」加半个乱码两个连在一起才凑齐这三个字。这也是老文章里的乱码经常成对出现的原因。五、验证与踩坑自检 12 条全绿UTF-16BE 解码却是崩的页面底部有自检区把每种编码的期望字节写成断言跑完显示通过条数。交付过来的时候是 12 条全绿。但我在字节解码器里试 UTF-16BE 的时候它当场就崩了。输入 4E 2D、选中 UTF-16BE输出是「❌ 解码失败e is not defined」。原因很小那个函数的成功分支里写了一句 e.message而 e 只在 catch 里存在。成功路径一走就抛 ReferenceError。更值得记的是它为什么没被自检拦住12 条断言全是把字符编成字节没有一条是把字节解回字符。编解码是对称的东西只测一半等于没测。我补了两条解码断言一条测「中」的 UTF-16BE一条测「汉」的 GBK现在自检是 14 条。第二处是文案错不改就是误导。右栏下面原来写着「烫烫烫来自 GBK 编码的汉字被 UTF-8 错误解码」这句话是错的。我在页面上试了原始字节CC CC 用 GBK 解是「烫」CD CD 用 GBK 解是「屯」。所以「烫烫烫」来自调试器把未初始化内存填成 0xCC跟「GBK 汉字被 UTF-8 解码」没关系。我把这段文案改成了正确说法改完又跑了一遍确认数字对得上。第三处是解码器对非法输入太宽容。原来输入 ZZ 11它把 Z 悄悄扔掉解出一个控制字符 0x11看起来像正常结果。现在它会直接报「❌ 含非十六进制字符ZZ」十六进制位数是奇数时也会提示补全。三处改完刷新自检 14/14UTF-16BE 解 4E 2D 得到「中」解 4E 2D 5B 57 得到「中字」。六、本地复现把案例目录下载下来随便起一个静态服务cdcodearts-unicode-encoding-lab python-mhttp.server8000浏览器打开 http://localhost:8000/index.html 就能看到跟截图一样的页面。不起服务直接双击 index.html 也可以。亲手点三下先看默认文本的字节表再把输入换成或看 N/A 那一格最后去解码器里贴一段非法十六进制看它怎么报错。七、准备环境打开码道 Web 版浏览器打开码道 Web 版https://devcloud.cn-north-4.huaweicloud.com/chat?sourcedmzntgwsfsourceaddmzntgwwbwz登录后在对话框里把需求说清楚就行不用装软件。码道有三种使用方式WebUI 浏览器对话、TUI 终端命令行和桌面 IDE 插件本文用的是 WebUI。八、用码道做这个页面的一点体会需求我一次说完了四种编码的字节序列、逐字符展开、乱码复现、字节解码器再加一个自检区。它一次就给了一个能跑的单文件页面内置预览里直接能点。但「能跑」和「对」是两件事。这三处问题里最要命的那处在自检全绿的情况下藏得最好。另外两处是文案和输入校验都属于不跑一遍就发现不了的。我的做法是把自检断言写进需求交付后自己再逐项点一遍尤其是编解码这种对称的东西。让 AI 写代码验收这一半得自己扛。九、边界我写清楚第一GBK 映射表是靠 TextDecoder(‘gbk’) 枚举出来的实测建出 24067 条覆盖常用汉字够用但它是按解码结果反推的不等价于一份权威码表。第二页面只处理 GBK不处理 GB18030也不处理 Big5 和 Shift-JIS。第三emoji 在 GBK 里编不出来页面统一用 0x3F 问号代替这是我定的规则不是标准规定。第四自检里的期望值是我手写的它只能证明代码算出了我预期的东西证明不了我的预期一定对。

一个汉字三种编码：UTF-8、GBK、UTF-16 逐字节对比实测

相关推荐

重组蛋白与传统蛋白的区别：从来源到特性的全面解析

又一编程顶级编程CLI开源，实测Step Code开发像素游戏并一键上线

ASP.NET MVC工作流源码深度解析与生产避坑指南

更多资讯

C/C++数据范围全解析：整型溢出、浮点精度与跨平台陷阱

DirectX 11键鼠输入处理：Win32消息机制与渲染循环协作实战

社交媒体海量行为数据如何用Hadoop体系完成存储、治理与离线计算

无标题内容创作工作流：从空白选题到高效成稿的完整实操指南

数电票时代发票管理工具选型指南：从全票种识别到合规归档

nginx离线安装实战：rpm依赖打包与本地yum源配置指南

今日更新

小波包能量谱原理与MATLAB实现：从频带分解到故障特征提取

基于LSTM的网易云音乐评论情感分析：数据清洗与模型调优实战

Alpha-Beta剪枝与极大极小值算法：博弈树搜索原理与实战优化

本周精选

交通拥堵预测毕设：基于Python+LSTM的车辆流量预测系统全流程解析

MATLAB/Simulink搭建10机39节点电力系统暂态稳定仿真实战

无人机航拍三维重建全流程：从SfM到网格生成的避坑指南

本月热门

我发现了一个新思路：用 Remotion + Claude Code 像写代码一样自动化生成短视频

Windows下 Codex 中 Chrome 和 Computer Use 插件不可用问题排查及解决参考方式：TaoToken 统一 Key 配置与验证

2026 大模型集体涨价：用 Python 做企业 Token 成本测算与选型避坑（附配置）

读完文章，想聊聊您的网站？