ES12 中的字符串 replaceAll 方法解析

在 ES12 中，JavaScript 新增了一个字符串方法 replaceAll，它可以用于全局替换字符串中的所有匹配项。在以前，我们可能需要使用正则表达式和 replace 方法来实现这个功能，但是这种方法需要写一些复杂的正则表达式，而且还不太容易理解。现在，使用 replaceAll 方法可以更加方便地实现这个功能。

replaceAll 方法的语法

replaceAll 方法的语法如下：

str.replaceAll(searchValue, replaceValue)

其中，searchValue 是要替换的字符串或正则表达式，replaceValue 是替换后的字符串或函数。该方法返回一个新字符串，替换所有匹配项。

replaceAll 方法的使用示例

替换字符串中的所有匹配项

const str = "Hello, World! Hello, JavaScript!";
const newStr = str.replaceAll("Hello", "Hi");
console.log(newStr); // "Hi, World! Hi, JavaScript!"

在这个例子中，我们使用 replaceAll 方法将字符串中的所有 "Hello" 替换成了 "Hi"。

使用正则表达式进行替换

const str = "123 456 789";
const newStr = str.replaceAll(/\d+/g, "$&-");
console.log(newStr); // "123- 456- 789-"

在这个例子中，我们使用了一个正则表达式 /\d+/g 来匹配字符串中的所有数字，并在每个数字后面添加了一个 "-" 符号。

使用函数进行替换

const str = "Hello, World! Hello, JavaScript!";
const newStr = str.replaceAll(/Hello/g, (match, offset, string) => {
  return offset === 0 ? "Hi" : "Hi,";
});
console.log(newStr); // "Hi, World! Hi, JavaScript!"

在这个例子中，我们使用了一个函数来替换字符串中的所有 "Hello"。函数接收三个参数：匹配项、匹配项的偏移量和原始字符串。在这个例子中，我们使用偏移量来判断是不是字符串的开头，如果是，则替换为 "Hi"，否则替换为 "Hi,"。

replaceAll 方法的注意事项

searchValue 必须是全局匹配

replaceAll 方法只能用于全局匹配，如果 searchValue 不是全局匹配，则只会替换第一个匹配项。

const str = "Hello, World! Hello, JavaScript!";
const newStr = str.replaceAll("Hello", "Hi");
console.log(newStr); // "Hi, World! Hello, JavaScript!"

在这个例子中，我们只替换了字符串中的第一个 "Hello"。

searchValue 不能是空字符串

如果 searchValue 是空字符串，则会抛出错误。

const str = "Hello, World!";
const newStr = str.replaceAll("", "Hi");
// Uncaught TypeError: "searchValue" argument must not be empty

replaceValue 可以是函数

replaceValue 可以是一个函数，函数接收三个参数：匹配项、匹配项的偏移量和原始字符串。函数返回值将作为替换后的字符串。

总结

replaceAll 方法是 ES12 中新增的字符串方法，它可以用于全局替换字符串中的所有匹配项。使用 replaceAll 方法可以更加方便地实现这个功能，而不需要写复杂的正则表达式。需要注意的是，searchValue 必须是全局匹配，不能是空字符串，replaceValue 可以是函数。

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