ES6 中的字符串扩展操作详解-JavaScript中文网-JavaScript教程资源分享门户

在 ES6 中，字符串的处理变得更加高效和便捷。从字符串模板、字符串扩展、正则表达式和数学方法，ES6 提供了我们更多有用的字符串处理方法。在本篇文章中，我们将深入探究 ES6 中的字符串扩展操作。

字符串模板

ES6 中，我们可以通过字符串模板更加方便的进行字符串的组合。字符串模板是由反引号 ` 包裹的字符串字面量，其中我们可以通过 ${} 插入变量或者表达式。

示例代码：

const name = 'Lucy';
const age = 18;
console.log(`My name is ${name}, I'm ${age} years old.`);
// 输出：My name is Lucy, I'm 18 years old.

通过使用字符串模板，我们可以很方便地组合字符串，避免了传统拼接字符串所带来的繁琐和易错的问题。

字符串扩展方法

ES6 中为字符串添加了一些非常有用的扩展方法，包括 startsWith、endsWith、includes、repeat、padStart 和 padEnd。下面将一一详细解析这些方法。

startsWith() 和 endsWith()

startsWith 和 endsWith 分别表示判断一个字符串是否以指定字符开头或结尾。这两个方法接收两个参数：一个是被查找的字符串，另一个是开始或结束的字符串。

示例代码：

const str = 'Hello world!';
console.log(str.startsWith('Hello')); // 输出：true
console.log(str.endsWith('world!')); // 输出：true

includes()

includes 方法用于判断一个字符串是否包含另一个字符串，接收的是一个被查找的字符串参数。

示例代码：

const str = 'Hello world!';
console.log(str.includes('world')); // 输出：true

repeat()

repeat 方法用于重复一个字符串，接收的是一个整数表示重复次数。

示例代码：

const str = 'ABC';
console.log(str.repeat(3)); // 输出：ABCABCABC

padStart() 和 padEnd()

padStart 和 padEnd 用于将一个字符串前后填充指定长度的字符串，用于美化输出格式。这两个方法接收两个参数：第一个是要填充的长度，第二个是填充使用的字符串。

示例代码：

const str = 'ABC';
console.log(str.padStart(6, '0')); // 输出：000ABC
console.log(str.padEnd(6, '0')); // 输出：ABC000

正则表达式

ES6 的字符串增加了对正则表达式的支持，包括了两个新的方法 matchAll 和 s 模式修饰符。

matchAll()

matchAll 用于返回一个迭代器，该迭代器可以遍历所有匹配的项，与 match 方法的全局匹配效果相似。该方法返回的是一个迭代器对象，我们可以通过 for of 循环或 spread 运算符 ... 访问它的每一个匹配项。

示例代码：

// javascriptcn.com 代码示例
const str = 'Hello123, My name is Lucy456.';
const reg = /\d+/g;
const matchAllResult = str.matchAll(reg);
for (const item of matchAllResult) {
  console.log(item);
}
// 输出：
// ["123", index: 5, input: "Hello123, My name is Lucy456.", groups: undefined]
// ["456", index: 23, input: "Hello123, My name is Lucy456.", groups: undefined]

s 模式修饰符

s 模式修饰符用于解决正则表达式中的换行符问题。以往在正则表达式匹配时，为了匹配到包含换行符的文本，需要使用复杂的语句，现在有了 s 模式修饰符，可以更加简单高效地解决这类问题。

示例代码：

const str = `Hello
World`;
const reg1 = /Hello.*World/;
const reg2 = /Hello[^]*World/s;
console.log(reg1.test(str)); // 输出：false
console.log(reg2.test(str)); // 输出：true

数学方法

ES6 还为字符串增加了几个数学方法，包括 charCodeAt、codePointAt 和 fromCharCode。

charCodeAt()

charCodeAt 返回指定索引处字符的 Unicode 编码，可以用于判断一个字符是否属于 ASCII 码。

示例代码：

const str1 = 'ABC';
const str2 = '你好';
console.log(str1.charCodeAt(0)); // 输出：65
console.log(str2.charCodeAt(0)); // 输出：20320

codePointAt()

codePointAt 返回指定索引处字符的 Unicode 编码，与 charCodeAt 的区别在于，codePointAt 可以处理四字节的 Unicode 编码。

示例代码：

const str1 = 'ABC';
const str2 = '\u{1F607}';
console.log(str1.codePointAt(0)); // 输出：65
console.log(str2.codePointAt(0)); // 输出：128519

fromCharCode()

fromCharCode 将 Unicode 编码转换为字符。

示例代码：

console.log(String.fromCharCode(65)); // 输出：A

总结

以上是 ES6 中字符串扩展操作的详细介绍。经过我们的讲解，相信大家已经更加了解了这些扩展方法的使用和作用。在实际开发中，我们可以根据具体业务需求，选择合适的操作方法进行字符串的处理，从而达到更好地效果。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/6533d0977d4982a6eb76e174