纯语言特性 ——ES11 中的 String.prototype.replaceAll 方法

在 Web 前端开发中，字符串的操作是非常常见的，然而在以往的 JavaScript 版本中，没有一种内置的方法能够替换字符串中所有的匹配部分，有时需要用正则表达式结合循环来实现。不过在 ES11 中，新增了一个字符串实例方法 replaceAll，可以方便地实现字符串中所有匹配部分的替换，极大地提高了开发效率。

方法语法

方法的语法如下：

str.replaceAll(searchValue, replaceValue)

其中，str 表示要操作的字符串，searchValue 是要替换的目标字符串或正则表达式，replaceValue 是将 searchValue 匹配到的字符串替换成的新字符串。该方法会返回一个新的字符串，不会改变原字符串。

示例代码

下面是一些示例代码，来演示 replaceAll 方法的使用。

// 将字符串中的所有匹配部分替换成新字符串
let str = 'Hello, world!'
let replacedStr = str.replaceAll('l', '*')
console.log(replacedStr)
// 输出：He**o, wor*d!

// 用正则表达式替换匹配部分
let str2 = '112358132134'
let replacedStr2 = str2.replaceAll(/\d{3}/g, '-')
console.log(replacedStr2)
// 输出：11-358-134

// 组合多个正则表达式，实现更灵活的替换
let str3 = 'Hello, WORLD!'
let replacedStr3 = str3.replaceAll(/Hello/i, '<strong>$&</strong>')
                    .replaceAll(/WORLD/, '<em>$&</em>')
console.log(replacedStr3)
// 输出：<strong>Hello</strong>, <em>WORLD</em>!

// 当 replaceValue 是一个函数时（例如下面这个返回小写的函数），可以通过参数传入匹配到的值来进行更灵活的处理。
let str4 = 'I am A MAN.'
let replacedStr4 = str4.replaceAll(/[A-Z]/g, (match) => {
  return match.toLowerCase()
})
console.log(replacedStr4)
// 输出：i am a mAN.

注意事项

虽然 replaceAll 方法使用十分方便，但也需要注意一些事项：

• searchValue 参数可以是正则表达式，但如果使用了 g 全局标志，则只会替换第一个匹配到的字符串。
• searchValue 和 replaceValue 两者都是字符串的情况下，searchValue 中的所有 . 和 \ 都需要进行转义，否则可能会得到不符合预期的结果。
• searchValue 为 null 或 undefined 时，会抛出一个 TypeError 异常。

总结

ES11 文档中，将 replaceAll 方法定义为了字符串实例的一个新的方法，因此它并没有出现在 String 对象上。利用 replaceAll 方法可以非常方便地实现字符串中所有匹配部分的替换，这一点在日常开发中使用频率极高，大家应当掌握。

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