详解：ECMAScript 6中的新字符串功能

杜英叡

2023-12-01

详解：ECMAScript 6中的新字符串功能

前言

该博客文章介绍了ECMAScript 6(ESC6)中字符串的新功能

一、Unicode代码点转义

Unicode“字符”（代码点）的长度为21位。JavaScript字符串（大致）是16位字符的序列，编码为UTF-16。因此，用两个JavaScript字符表示超出代码点范围的前16位的代码点（基本多语言窗格BMP）。到目前为止，如果您想通过数字指定此类代码点，则需要两个所谓的Unicode转义符。例如，以下语句将火箭（代码点0x1F680）打印到大多数控制台：

console.log(’\uD83D\uDE80’);
在ECMAScript 6中，有一种新型的Unicode转义，可让您指定任何代码点：

console.log(’\u{1F680}’);

二、字符串插值，多行字符串文字和原始字符串文字

模板字符串提供了三个有趣的功能。

首先，模板字符串支持字符串插值：

let first = ‘Jane’;
let last = ‘Doe’;
console.log(Hello ${first} ${last}!);
// Hello Jane Doe!
其次，模板字符串可以包含多行：

let multiLine = This is a string with multiple lines;
第三，如果模板字符串带有标签前缀，则它们是“原始的” String.raw–反斜杠不是特殊字符，并且转义符例如\n不会被解释：

let raw = String.rawNot a newline: \n;
console.log(raw === ‘Not a newline: \n’); // true

三、遍历字符串

字符串是可迭代的，这意味着您可以for-of用来迭代其字符：

for (let ch of ‘abc’) {
console.log(ch);
}
// Output:
// a
// b
// c
您可以使用传播运算符（…）将字符串转换为数组：

let chars = […‘abc’];
// [‘a’, ‘b’, ‘c’]
处理Unicode代码点
字符串迭代器沿代码点边界分割字符串，这意味着它返回的字符串包含一个或两个字符：

for (let ch of ‘x\uD83D\uDE80y’) {
console.log(ch.length);
}
// Output:
// 1
// 2
// 1
这使您可以快速计算字符串中的Unicode代码点：

[…‘x\uD83D\uDE80y’].length
3
它还有助于反转包含非BMP代码点的字符串：

let str = ‘x\uD83D\uDE80y’;

// ES5: \uD83D\uDE80 are (incorrectly) reversed
console.log(str.split(’’).reverse().join(’’));
// ‘y\uDE80\uD83Dx’

// ES6: order of \uD83D\uDE80 is preserved
console.log([…str].reverse().join(’’));
// ‘y\uD83D\uDE80x’
Firefox控制台中两个相反的字符串。

三·2、码点数值

新方法codePointAt()返回字符串中给定索引处的代码点的数值：

let str = ‘x\uD83D\uDE80y’;
console.log(str.codePointAt(0).toString(16)); // 78
console.log(str.codePointAt(1).toString(16)); // 1f680
console.log(str.codePointAt(3).toString(16)); // 79
与字符串迭代结合使用时，此方法效果很好：

for (let ch of ‘x\uD83D\uDE80y’) {
console.log(ch.codePointAt(0).toString(16));
}
// Output:
// 78
// 1f680
// 79
相反的codePointAt()是String.fromCodePoint()：

String.fromCodePoint(0x78, 0x1f680, 0x79) === ‘x\uD83D\uDE80y’
true

四、检查遏制和重复串

三种新方法检查一个字符串是否在另一个字符串中：

‘hello’.startsWith(‘hell’)
true
‘hello’.endsWith(‘ello’)
true
‘hello’.includes(‘ell’)
true
这些方法中的每一个都有一个位置作为可选的第二个参数，它指定要搜索的字符串的开始或结束位置：

‘hello’.startsWith(‘ello’, 1)
true
‘hello’.endsWith(‘hell’, 4)
true

‘hello’.includes(‘ell’, 1)
true
‘hello’.includes(‘ell’, 2)
false
该repeat()方法重复字符串：

'doo '.repeat(3)
'doo doo doo ’

五、所有新方法

模板字符串：

String.raw(callSite, …substitutions) : string
“原始”内容的模板字符串标记（不解释反斜杠）。
Unicode和代码点：

String.fromCodePoint(…codePoints : number[]) : string
将表示Unicode代码点的数字转换为字符串。
String.prototype.codePointAt(pos) : number
返回从位置开始pos（包括一个或两个JavaScript“字符”）的代码点的编号。
String.prototype.normalize(form? : string) : string
代码点的不同组合可能看起来相同。Unicode规范化将它们全部更改为相同的值，即所谓的规范表示。这有助于比较和搜索字符串。'NFC’建议将该表格用于一般文本。
查找字符串：

String.prototype.startsWith(searchString, position=0) : boolean
接收器从searchString哪里开始？position使您可以指定要检查的字符串的起始位置。
String.prototype.endsWith(searchString, endPosition=searchString.length) : boolean
接收器结尾searchString吗？endPosition使您可以指定要检查的字符串的结束位置。
String.prototype.includes(searchString, position=0) : boolean
接收器是否包含searchString？position使您可以指定要搜索的字符串的起始位置。
重复字符串：

String.prototype.repeat(count) : string
返回接收者的连接count时间。

详解：ECMAScript 6中的新字符串功能