JavaScript教程：深入理解Unicode与字符串内部机制

JavaScript教程：深入理解Unicode与字符串内部机制

en.javascript.info Modern JavaScript Tutorial 项目地址: https://gitcode.com/gh_mirrors/en/en.javascript.info

前言：为什么需要了解Unicode

在JavaScript中，字符串是基于Unicode标准构建的。虽然大多数情况下我们不需要关心字符串的内部表示，但当我们需要处理表情符号、罕见数学符号、象形文字或其他特殊字符时，了解Unicode的工作原理就变得至关重要。

Unicode编码表示法

JavaScript提供了三种表示Unicode字符的方式：

1. \xXX 表示法

• 适用于Unicode码点在U+0000到U+00FF范围内的字符
• XX必须是两位十六进制数
• 示例：

console.log("\x7A"); // 输出 "z" (Unicode U+007A)
console.log("\xA9"); // 输出版权符号 "©"

2. \uXXXX 表示法

• 适用于Unicode码点在U+0000到U+FFFF范围内的字符
• XXXX必须是四位十六进制数
• 示例：

console.log("\u00A9"); // 同样输出版权符号 "©"
console.log("\u2191"); // 输出向上箭头 "↑"

3. \u{X...XXXXXX} 表示法

• 最灵活的表示法，支持1到6位十六进制数
• 可以表示所有Unicode字符（码点最高到U+10FFFF）
• 示例：

console.log("\u{20331}"); // 输出罕见汉字 "佫"
console.log("\u{1F60D}"); // 输出笑脸表情 "😍"

代理对(Surrogate Pairs)问题

什么是代理对

最初JavaScript基于UTF-16编码，每个字符使用2字节（16位）表示。但2字节只能表示65536个不同字符，不足以覆盖所有Unicode字符。因此，超出这个范围的字符使用两个16位码元（称为"代理对"）来表示。

代理对带来的问题

console.log('𝒳'.length); // 输出2，而不是1
console.log('😂'.length); // 输出2，而不是1

这是因为这些字符实际上由两个16位码元组成，而JavaScript的字符串方法大多将它们视为两个独立字符。

正确处理代理对

JavaScript提供了专门处理代理对的方法：

// charCodeAt无法正确处理代理对
console.log('𝒳'.charCodeAt(0).toString(16)); // 输出d835（仅第一部分）

// codePointAt可以正确处理代理对
console.log('𝒳'.codePointAt(0).toString(16)); // 输出1d4b3（完整码点）

组合字符与Unicode规范化

组合字符问题

许多语言使用基础字符加上附加符号（如重音符号）组成新字符。Unicode允许两种表示方式：

1. 预组合字符（单个码点）
2. 基础字符+组合标记（多个码点）

let s1 = 'S\u0307\u0323'; // S + 上点 + 下点
let s2 = 'S\u0323\u0307'; // S + 下点 + 上点

console.log(s1 === s2); // false，尽管视觉上相同

解决方案：规范化

使用normalize()方法可以将字符串转换为标准形式：

console.log("S\u0307\u0323".normalize() === "S\u0323\u0307".normalize()); // true

规范化有时会将多个字符序列合并为单个字符：

console.log("S\u0307\u0323".normalize().length); // 输出1
console.log("S\u0307\u0323".normalize() === "\u1e68"); // true

实际开发中的注意事项

1. 字符串长度计算：包含代理对或组合字符的字符串，其length属性可能不反映可见字符数
2. 字符串分割：随意分割字符串可能导致无效的Unicode序列
3. 字符串比较：视觉相同的字符串可能有不同的Unicode表示，比较前应考虑规范化

// 错误的分割示例
console.log('hi 😂'.slice(0, 4)); // 可能输出乱码

总结

理解JavaScript中Unicode字符串的内部表示对于处理国际化文本、表情符号和特殊符号至关重要。关键点包括：

1. 掌握三种Unicode表示法的使用场景
2. 了解代理对机制及其对字符串操作的影响
3. 使用codePointAt等方法正确处理代理对
4. 在比较或处理组合字符时进行规范化

这些知识将帮助开发者避免在处理特殊字符时遇到意外问题，确保应用程序能够正确处理全球各种语言的文本。

en.javascript.info Modern JavaScript Tutorial 项目地址: https://gitcode.com/gh_mirrors/en/en.javascript.info