JavaScript字符串基于UTF-16编码,BMP字符占2字节,非BMP如emoji需代理对占4字节;'?'.length为2但实际是1个字符,应使用Array.from('?').length或扩展运算符获取正确长度;访问字符时charAt可能截断代理对导致乱码,推荐用String.prototype.at()或codePointAt判断;正则需加u标志支持Unicode,如/^.$/u.test('?')返回true,\p{Emoji}可匹配emoji。

JavaScript 中的字符串基于 UTF-16 编码,这使得处理 Unicode 字符时容易出现一些意料之外的问题。掌握正确的 Unicode 处理技巧,能有效避免字符截断、长度误判等问题。
理解 Unicode 与 UTF-16 编码
Unicode 是为全球字符设计的统一编码标准,每个字符对应一个码点(Code Point),例如 U+1F600 表示“?”。但 JS 字符串使用 UTF-16 编码存储,这意味着:
- 基本多文种平面(BMP)字符(U+0000 到 U+FFFF)占 2 个字节,用一个 16 位单元表示
- 超出 BMP 的字符(如 emoji、部分汉字)需用代理对(Surrogate Pair)表示,占 4 个字节,即两个 16 位单元
例如,“?” 的码点是 U+20BB7,在 JS 中会被表示为两个 \u{20BB7} 才能正确解析。
正确获取字符串长度
直接使用 string.length 可能返回错误结果,因为代理对会被算作两个字符。
错误示例:'?'.length 返回 2,但实际上它是一个字符。
使用 ES6 的 Array.from() 或扩展运算符:
-
Array.from('?').length→ 1 -
[...'?'].length→ 1
或者使用 String.prototype.codePointAt() 遍历码点来计数。
安全地访问和截取字符
使用 charAt() 或索引访问可能只拿到代理对的一半,导致乱码。
-
'?'.charAt(0)返回空字符或乱码
推荐使用 String.prototype.at()(现代浏览器支持)或结合 codePointAt 手动判断:
安全截取函数示例:function getChar(str, index) { const code = str.codePointAt(index); if (code >= 0x10000) return str.slice(index, index + 2); return str[index]; }
正则表达式中的 Unicode 支持
默认正则不识别代理对或 Unicode 属性。使用 u 标志启用完整 Unicode 支持。
-
/^.$/u.test('?')→ true(匹配单个码点) -
/\p{Emoji}/u可匹配 emoji(需配合属性)
利用 \p{} 和 Polyfill 可实现更复杂的 Unicode 字符分类匹配。
基本上就这些常见场景。只要注意码点与编码单元的区别,使用现代 API 处理,就能避免大多数 Unicode 陷阱。









