ES11 中字符串方法的 replaceAll 详解

ES11 中字符串方法的 replaceAll 详解

在 ES11 中，JavaScript 引入了一个新的字符串方法 replaceAll，该方法用于全局替换一个字符串中的所有匹配项。

语法：

string.replaceAll(searchValue, replaceValue)

其中，searchValue 表示需要被替换的子字符串，replaceValue 表示替换成的新字符串。如果 searchValue 是一个正则表达式，则 replaceValue 可以使用 $1、$2 这样的语法表示正则表达式中的捕获组。

replaceAll 方法会返回一个新的字符串，不会修改原始字符串。

示例代码：

const str = 'apple apple apple';
const newStr = str.replaceAll('apple', 'orange');
console.log(newStr); // 'orange orange orange'

const str2 = 'hello world';
const newStr2 = str2.replaceAll(/\b(\w+)\b/g, '<span>$1</span>');
console.log(newStr2); // '<span>hello</span> <span>world</span>'

需要注意的是，该方法只有在浏览器或 Node.js 版本支持 ES11 才可用，否则会抛出 SyntaxError 错误。

在实际开发中，常常需要全局替换一个字符串中的某些内容。在 ES10 之前，通常需要使用正则表达式结合 replace 方法实现：

const str = 'apple apple apple';
const newStr = str.replace(/apple/g, 'orange');
console.log(newStr); // 'orange orange orange'

使用正则表达式的方式虽然实现了全局替换，但代码比较复杂，需要编写正则表达式，并且不易理解。在 ES11 中，使用 replaceAll 方法可以更简便地实现相同的功能。

需要注意的是，由于 replaceAll 方法只是在一些新版本的浏览器以及 Node.js 中可用，因此在实际开发中需要进行相应的版本兼容性处理。

总结

ES11 新增的字符串方法 replaceAll 可以更简单地实现全局替换字符串的功能，并且支持正则表达式，提高了代码的可读性和可维护性。

在使用该方法时需要注意版本兼容性，另外，使用正则表达式的功能需要熟练掌握正则表达式的语法和特性。

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