字符串的扩展
加强对 Unicode 的支持。
ES6 加强了对 Unicode
的支持,允许采用 \uxxxx
形式表示一个字符。但这种表示法只限于码点在 \u0000 ~ \uFFFF
之间的字符。超出这个范围的字符,必须用两个双字节的形式表示。
"\u0061";
// "a"
"\uD842\uDFB7";
// "𠮷"
ES6 对这一点做出了改进,只要将码点放入大括号,就能正确解读该字符。
"\u{20BB7}";
// "𠮷"
有了这种表示法之后,JavaScript 共有 6 种方法可以表示一个字符。
"z" === "z"; // true
"\172" === "z"; // true
"\x7A" === "z"; // true
"\u007A" === "z"; // true
"\u{7A}" === "z"; // true
字符串的 Iterator(迭代器)接口
for (let c of "abcde") {
console.log(c);
}
// 'a', 'b', 'c', 'd', 'e'
直接输入 U+2028 和 U+2029
JavaScript 规定有 5 个字符,不能在字符串里面直接使用,只能使用转义形式:
- U+005C:反斜杠(reverse solidus)
- U+000D:回车(carriage return)
- U+2028:行分隔符(line separator)
- U+2029:段分隔符(paragraph separator)
- U+000A:换行符(line feed)
冲突: JSON 格式允许字符串里面直接使用 U+2028(行分隔符)和 U+2029(段分隔符)
为了解决和 JSON 的冲突,ES2019 允许 JavaScript 字符串直接输入 U+2028(行分隔符)和 U+2029(段分隔符)
JSON.stringify() 的改造
UTF-8 标准规定,0xD800 到 0xDFFF 之间的码点,不能单独使用,必须配对使用。
JSON.stringify()
的问题在于,它可能返回 0xD800 到 0xDFFF 之间的单个码点。
为了确保返回的是合法的 UTF-8 字符,ES2019 改变了 JSON.stringify()的行为。如果遇到 0xD800 到 0xDFFF 之间的单个码点,或者不存在的配对形式,它会返回转义字符串,留给应用自己决定下一步的处理。
模板字符串
const name = "abc";
console.log(`hello, ${name}`); // 'hello, abc'
标签模板
模板字符串可以紧跟在一个函数名后面,该函数将被调用来处理这个模板字符串。
alert`hello`;
// 等同于
alert(["hello"]);
字符串的新增方法
String.fromCodePoint()
ES5 提供 String.fromCharCode()
方法,用于从 Unicode 码点返回对应字符,但是这个方法不能识别码点大于 0xFFFF 的字符。
String.fromCharCode(0x20bb7);
// "ஷ"
ES6 提供了 String.fromCodePoint()
方法,可以识别大于 0xFFFF 的字符,弥补了 String.fromCharCode()
方法的不足。
String.fromCodePoint(0x20bb7);
// "𠮷"
String.raw()
该方法返回一个斜杠都被转义(即斜杠前面再加一个斜杠)的字符串,往往用于模板字符串的处理方法。
String.raw`Hi\n${2 + 3}!`;
// 实际返回 "Hi\\n5!",显示的是转义后的结果 "Hi\n5!"
String.raw()本质上是一个正常的函数,只是专用于模板字符串的标签函数。
实例方法:codePointAt()
ES6 提供了 codePointAt()
方法,能够正确处理 4 个字节储存的字符,返回一个字符的码点。
实例方法:normalize()
ES6 提供字符串实例的 normalize()
方法,用来将字符的不同表示方法统一为同样的形式,这称为 Unicode 正规化。
实例方法:includes(), startsWith(), endsWith()
includes()
:返回布尔值,表示是否找到了参数字符串。startsWith()
:返回布尔值,表示参数字符串是否在原字符串的头部。endsWith()
:返回布尔值,表示参数字符串是否在原字符串的尾部。
let s = "Hello world!";
s.startsWith("Hello"); // true
s.endsWith("!"); // true
s.includes("o"); // true
这三个方法都支持第二个参数,表示开始搜索的位置。
使用第二个参数 n 时,endsWith
的行为与其他两个方法有所不同。它针对前 n 个字符,而其他两个方法针对从第 n 个位置直到字符串结束。
实例方法:repeat()
repeat
方法返回一个新字符串,表示将原字符串重复 n 次。
"x".repeat(3); // "xxx"
"na".repeat(2.9); // 参数如果是小数,会被取整 "nana"
实例方法:padStart(),padEnd()
ES2017 引入了字符串补全长度的功能。如果某个字符串不够指定长度,会在头部或尾部补全。padStart()
用于头部补全,padEnd()
用于尾部补全。
"x".padStart(5, "ab"); // 'ababx'
"x".padEnd(5, "ab"); // 'xabab'
如果省略第二个参数,默认使用空格补全长度。
实例方法:trimStart(),trimEnd()
ES2019 对字符串实例新增了 trimStart()
和 trimEnd()
这两个方法。它们的行为与 trim()
一致,trimStart()
消除字符串头部的空格,trimEnd()
消除尾部的空格。它们返回的都是新字符串,不会修改原始字符串。
实例方法:matchAll()
matchAll()
方法返回一个正则表达式在当前字符串的所有匹配。
实例方法:replaceAll()
字符串的实例方法 replace()
只能替换第一个匹配。
如果要替换所有的匹配,不得不使用正则表达式的 g 修饰符。
"aabbcc".replace(/b/g, "_");
ES2021 引入了 replaceAll()
方法,可以一次性替换所有匹配。
返回一个新字符串,不会改变原字符串。
实例方法:at()
at()
方法接受一个整数作为参数,返回参数指定位置的字符,支持负索引(即倒数的位置)。
const str = "hello";
str.at(1); // "e"
str.at(-1); // "o"