了解 ES11 的 String 方法改变

前言

在前端开发中，字符串处理是非常常见的一种操作。在 ES11 中，新增了一些字符串方法，这些方法可以为我们在字符串处理中提供更多的便利。本文将介绍 ES11 中新增的字符串方法，帮助开发者更好地了解这些方法的使用，避免因不熟悉新特性带来的坑。

String.prototype.replaceAll()

在以往的字符串操作中，我们经常使用 String.prototype.replace() 方法来替换字符串中的某些字符。但是，这个方法只会替换第一个匹配项，如果我们需要替换所有匹配项，就需要使用正则表达式，并设置全局匹配。ES11 中新增了 String.prototype.replaceAll() 方法，可以直接替换所有匹配项，而不需要使用正则表达式。

const str = 'hello world';
const newStr = str.replaceAll('l', 'x');
console.log(newStr); // 'hexxo worxd'

String.prototype.trimStart() 和 String.prototype.trimEnd()

在以往的字符串操作中，我们经常使用 String.prototype.trim() 方法来去除字符串两端的空格。但是，这个方法只能去除两端的空格，不能去除字符串中间的空格。ES11 中新增了 String.prototype.trimStart() 和 String.prototype.trimEnd() 方法，可以分别去除字符串开头和结尾的空格。

const str = '   hello world   ';
const newStr1 = str.trimStart();
const newStr2 = str.trimEnd();
console.log(newStr1); // 'hello world   '
console.log(newStr2); // '   hello world'

String.prototype.matchAll()

在以往的字符串操作中，我们经常使用 String.prototype.match() 方法来获取字符串中与正则表达式匹配的部分。但是，这个方法只能获取第一个匹配项，如果需要获取所有匹配项，就需要使用正则表达式，并设置全局匹配。ES11 中新增了 String.prototype.matchAll() 方法，可以直接获取所有匹配项，而不需要使用正则表达式。

const str = 'hello world';
const regex = /[aeiou]/g;
const matches = str.matchAll(regex);
for (const match of matches) {
  console.log(match[0]);
}
// 'e'
// 'o'

String.prototype.startsWith() 和 String.prototype.endsWith()

在以往的字符串操作中，我们经常使用 String.prototype.indexOf() 方法来判断字符串是否以某个子串开头或结尾。但是，这个方法只能判断字符串中是否包含某个子串，不能直接判断字符串是否以某个子串开头或结尾。ES11 中新增了 String.prototype.startsWith() 和 String.prototype.endsWith() 方法，可以直接判断字符串是否以某个子串开头或结尾。

const str = 'hello world';
console.log(str.startsWith('hello')); // true
console.log(str.endsWith('world')); // true

总结

ES11 中新增的字符串方法可以为我们在字符串处理中提供更多的便利，但是在使用这些方法时，我们也需要注意一些细节。比如，String.prototype.replaceAll() 方法只能替换字符串中的字符，不能替换字符串中的子串；String.prototype.matchAll() 方法返回的是一个迭代器，需要使用 for...of 循环来遍历；String.prototype.startsWith() 和 String.prototype.endsWith() 方法第二个参数可以指定开始或结束的位置。通过了解这些细节，我们可以更好地使用这些新特性，避免因不熟悉新特性带来的坑。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6505932195b1f8cacd1fb5f0