在 ECMAScript 2020（ES11）中使用字符串的新特性-JavaScript中文网-JavaScript教程资源分享门户

随着 ECMAScript 的不断更新，字符串的新特性也越来越多。在 ECMAScript 2020（ES11）中，字符串的新特性更是让前端开发者们大呼过瘾。本文将详细介绍 ES11 中字符串的新特性，包括模板字面量、字符串匹配、字符串替换和字符串填充。

模板字面量

模板字面量是 ES11 中最常用的字符串新特性之一。它允许我们在字符串中嵌入表达式，并且可以跨行书写，这样可以大大提高代码的可读性和可维护性。

具体来说，模板字面量可以使用反引号（`）来定义，其中表达式可以使用 ${} 来包裹。例如：

const name = 'Alice';
const age = 18;
const message = `Hello, my name is ${name}, and I'm ${age} years old.`;

在上面的代码中，我们使用模板字面量定义了一个字符串 message。其中，${name} 和 ${age} 分别是两个表达式，它们的值将会被计算后插入到字符串中。

字符串匹配

ES11 中新增了一些字符串匹配的方法，可以帮助我们更方便地处理字符串。

String.prototype.matchAll()

String.prototype.matchAll() 方法可以返回一个迭代器，用于遍历字符串中所有匹配指定正则表达式的子串。例如：

const str = 'Hello world, hello JavaScript!';
const regex = /hello/gi;
const matches = str.matchAll(regex);

for (const match of matches) {
  console.log(match[0]);
}

在上面的代码中，我们使用 matchAll() 方法遍历了字符串 str 中所有匹配 /hello/gi 的子串，并将它们输出到控制台上。

String.prototype.match()

String.prototype.match() 方法可以返回一个数组，其中包含了字符串中所有匹配指定正则表达式的子串。例如：

const str = 'Hello world, hello JavaScript!';
const regex = /hello/gi;
const matches = str.match(regex);

console.log(matches);

在上面的代码中，我们使用 match() 方法获取了字符串 str 中所有匹配 /hello/gi 的子串，并将它们打印到控制台上。

字符串替换

ES11 中新增了一些字符串替换的方法，可以帮助我们更方便地替换字符串中的内容。

String.prototype.replaceAll()

String.prototype.replaceAll() 方法可以将字符串中所有匹配指定正则表达式的子串替换为指定的字符串。例如：

const str = 'Hello world, hello JavaScript!';
const regex = /hello/gi;
const newStr = str.replaceAll(regex, 'hi');

console.log(newStr);

在上面的代码中，我们使用 replaceAll() 方法将字符串 str 中所有匹配 /hello/gi 的子串替换为 hi，并将替换后的字符串打印到控制台上。

String.prototype.replace()

String.prototype.replace() 方法可以将字符串中第一个匹配指定正则表达式的子串替换为指定的字符串。例如：

const str = 'Hello world, hello JavaScript!';
const regex = /hello/gi;
const newStr = str.replace(regex, 'hi');

console.log(newStr);

在上面的代码中，我们使用 replace() 方法将字符串 str 中第一个匹配 /hello/gi 的子串替换为 hi，并将替换后的字符串打印到控制台上。

字符串填充

ES11 中新增了一些字符串填充的方法，可以帮助我们更方便地填充字符串。

String.prototype.padStart()

String.prototype.padStart() 方法可以在字符串的开头填充指定的字符，直到字符串达到指定的长度。例如：

const str = 'hello';
const newStr = str.padStart(10, '-');

console.log(newStr);

在上面的代码中，我们使用 padStart() 方法在字符串 str 的开头填充 -，直到字符串达到 10 个字符的长度，并将填充后的字符串打印到控制台上。

String.prototype.padEnd()

String.prototype.padEnd() 方法可以在字符串的结尾填充指定的字符，直到字符串达到指定的长度。例如：

const str = 'hello';
const newStr = str.padEnd(10, '-');

console.log(newStr);

在上面的代码中，我们使用 padEnd() 方法在字符串 str 的结尾填充 -，直到字符串达到 10 个字符的长度，并将填充后的字符串打印到控制台上。

总结

ES11 中新增的字符串新特性包括模板字面量、字符串匹配、字符串替换和字符串填充。这些新特性可以帮助我们更方便地处理字符串，提高代码的可读性和可维护性。在实际开发中，我们可以根据需求灵活使用这些新特性，提高我们的开发效率。

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