随着前端技术的不断发展，ECMAScript 2021 (ES12) 带来了一些新的功能和特性，其中之一就是字符串的扩展方法。本文将介绍这些新功能，并提供详细的示例代码和指导意义。
1. 字符串的 trimStart() 和 trimEnd() 方法
在 ES12 中，字符串新增了两个方法：trimStart() 和 trimEnd()。它们的作用分别是删除字符串开头和结尾的空格。
示例代码：
const str = ' hello world '; console.log(str.trimStart()); // 'hello world ' console.log(str.trimEnd()); // ' hello world'
这两个方法对于处理用户输入的字符串非常有用，可以消除输入时不必要的空格。
2. 字符串的 replaceAll() 方法
在 ES12 中，字符串新增了一个 replaceAll() 方法，它可以替换字符串中的所有匹配项。
示例代码：
const str = 'hello world';
console.log(str.replaceAll('l', 'L')); // 'heLLo worLd'这个方法可以方便地替换字符串中的所有匹配项，而不必使用正则表达式或多次调用 replace() 方法。
3. 字符串的 matchAll() 方法
在 ES12 中，字符串新增了一个 matchAll() 方法，它可以返回一个迭代器，用于迭代字符串中所有匹配正则表达式的结果。
示例代码：
const str = 'hello world';
const regex = /l/g;
const matches = str.matchAll(regex);
for (const match of matches) {
console.log(match[0]); // 'l'
}这个方法可以让我们以一种更简单的方式处理匹配正则表达式的结果，而不必使用循环和 exec() 方法。
4. 字符串的 padStart() 和 padEnd() 方法
在 ES12 中，字符串新增了两个方法：padStart() 和 padEnd()。它们可以在字符串开头或结尾填充指定的字符，以达到指定的长度。
示例代码：
const str = 'hello'; console.log(str.padStart(10, 'x')); // 'xxxxxhello' console.log(str.padEnd(10, 'x')); // 'helloxxxxx'
这个方法对于创建格式化的字符串非常有用，可以让字符串保持一致的长度。
5. 字符串的可选分组捕获
在 ES12 中，正则表达式新增了一个可选分组捕获的语法，它可以让我们更简单地处理匹配结果。
示例代码：
const str = '2021-01-01';
const regex = /(\d{4})-(\d{2})-(\d{2})?/;
const [, year, month, day = '01'] = str.match(regex);
console.log(year); // '2021'
console.log(month); // '01'
console.log(day); // '01'这个语法可以让我们更方便地处理可选的匹配结果，而不必使用条件语句或多个正则表达式。
结论
ES12 中的字符串扩展方法为我们提供了更多的工具来处理字符串，使我们的代码更加简洁、易读和维护。通过学习这些新的功能，我们可以更好地应对实际开发中遇到的问题，提高开发效率和代码质量。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67592cc636908a98ca6a37c2