JavaScript字符串全面升级指南：从Unicode到模板字符串一、处理Unicode的利器：codePointAt

一、处理Unicode的利器：codePointAt()

传统方法的局限

'𠮷'.charCodeAt(0); // 55362 (错误结果)
'𠮷'.charCodeAt(1); // 57271 (错误结果)

现代解决方案

'𠮷'.codePointAt(0); // 134071 (正确码点)

ps：上面代码说明，对于4给字节储存的字符，JavaScript不能正确处理。字符串长度会被误判为2，而且charAt方法无法读取到字符，charCodeAt方法只能分别返回前两个字节和后两个字节的值。

技术要点：

支持0xFFFF以上的码点
自动识别四字节字符
返回值可直接用于码点运算

二、逆向操作：String.fromCodePoint()

ps：fromCodePoint方法定义在String对象上，而codePointAt方法定义在字符串的实例对象上。

对比传统方法

String.fromCharCode(0x20BB7); // "ஷ" (错误)
String.fromCodePoint(0x20BB7); // "𠮷" (正确)

多参数支持

String.fromCodePoint(97, 0x2F804, 98); // "a你b"

三、Unicode表示法升级

新表示法

'\u{1F680}' === '🚀'; // true

编码对比

表示方式	示例	支持版本
`\uXXXX`	`\u0041` → A	ES5
`\u{XXXXXX}`	`\u{1F4A9}` → 💩	ES6

但是这种表示法只限于\u0000——\uFFFF之间的字符。超出这个范围的字符，必须用两个双字节的形式表达。可以放入大括号解决

'\u20BB7' //" 7" （超过限制，不可打印字符，显示空格+7）

'\u{20BB7}' === '𠮷'; // true

四、正则表达式u修饰符

ES6对正则表达式添加了u修饰符，用来正确处理大于\uFFFF的Unicode字符。

典型应用场景

/^.$/u.test('𠮷'); // true
/𠮷{2}/u.test('𠮷𠮷'); // true

功能对比

/^.$/.test('👨👩👧'); // false
/^.$/u.test('👨👩👧'); // true

五、智能检测三剑客

方法对比

高级用法

const path = '/user/profile';
path.startsWith('/user', 0); // true
path.endsWith('profile', path.length); // true

上面代码使用第二个参数规则：endsWith针对前path.length个字符，startsWith针对第0个位置直到字符串结束的字符。

六、重复生成：repeat()

应用场景

'Loading' + '!'.repeat(3); // "Loading!!!"
' '.repeat(4); // "    "

边界处理

'na'.repeat(2.9); // "nana" (自动取整)
'hi'.repeat(-1); // 报错

七、正则表达式y修饰符

ps：y修饰符匹配必须从剩余的第一个位置开始，这也是“粘连”的涵义。

粘连匹配示例

const reg = /a+/y;
reg.lastIndex = 1; 
reg.exec('aaa'); // null

性能对比

// 匹配10万次测试：
// sticky模式快约30%

具体细节可以看我的上一篇文章正则表达式性能翻倍秘籍：y修饰符精准锁定匹配位置

八、革命性特性：模板字符串

基础模板

`用户${name}，余额：${amount.toFixed(2)}元`

高级用法

// 标签模板
function securityCheck(strings, ...values) {
  // 自动转义检测
  return strings.reduce((prev, curr, i) => 
    prev + curr + (values[i] || ''), '');
}

securityCheck`<div>${userInput}</div>`;

原始字符串

String.raw`换行符：\n`; // "换行符：\\n"

综合对比表

特性	ES5支持	ES6+支持	典型应用场景
codePointAt	❌	✅	处理Emoji字符
模板字符串	❌	✅	动态HTML生成
y修饰符	❌	✅	词法分析器开发
Unicode新表示法	❌	✅	特殊符号处理

升级建议：

使用Babel进行语法转换
配置ESLint规则检测传统方法
优先使用现代字符串操作方法
重要数据操作添加Unicode兼容处理

通过合理运用这些新特性，可使字符串处理代码：

减少30%以上代码量
提升字符操作准确性
增强国际化支持能力
提高正则表达式性能