ES11 中新增了 String.prototype.replaceAll() 方法，可以在字符串中查找并替换所有匹配的子串。本文将详细介绍该方法的使用方法，并通过示例代码演示如何在前端开发中使用它。
使用方法
replaceAll() 方法的语法如下：
string.replaceAll(searchValue, replaceValue)
其中，searchValue 是被替换的子串，可以是一个字符串或正则表达式；replaceValue 是替换成的新字符串，也可以是一个函数，用于动态生成替换字符串。
例如，我们可以通过以下代码将字符串中所有的 "foo" 替换成 "bar"：
const str = "foo foo foo"
const newStr = str.replaceAll("foo", "bar")
console.log(newStr) // "bar bar bar"我们也可以使用正则表达式来进行字符串替换，例如将字符串中的所有空格替换成下划线：
const str = "hello world" const newStr = str.replaceAll(/\s/g, "_") console.log(newStr) // "hello_world"
使用函数进行动态替换也很方便，例如将字符串中的所有数字加倍：
const str = "1 2 3 4 5" const newStr = str.replaceAll(/\d/g, match => match * 2) console.log(newStr) // "2 4 6 8 10"
注意事项
需要注意的是，在一些旧版本的浏览器上，如 Safari 14、iOS 14.0 和 Firefox 77 中，replaceAll() 方法没有被完全支持。此外，由于该方法是在 ES11 中新增的，因此它也不能在较老的 JavaScript 环境中使用。
使用场景
replaceAll() 方法可以用于许多场景中，例如：
- 在文本编辑器中替换文本
- 处理表单输入，例如将所有空格或其他特殊字符删除或替换
- 验证数据，例如检查是否有非法字符或不符合格式要求的数据
示例代码
以下是一个使用 replaceAll() 方法处理表单数据的示例代码：
-- -------------------- ---- ------- ------ ------ ------------------------ ------ ----------- ------------ ---------- --------- ------- ------------- ------------------------------------ ------- -------- -------- -------------- - ----- ----- - -------------------------------------- ----- -------------- - --------------------------------- --- ----------------------------------- - ---------
在该示例代码中，我们使用了正则表达式 /[^a-zA-Z0-9]/g 来匹配除了英文字母和数字以外的所有字符，并使用 replaceAll() 方法将其删除。最后将处理后的数据作为弹出框的内容显示出来。
总结
String.prototype.replaceAll() 是一种很便捷的替换字符串的方式，可以大量减少我们编写代码的时间和工作量。但需要注意的是在旧版本的一些浏览器上可能无法完全支持该方法，因此在使用时需进行兼容性考虑。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/646fad01968c7c53b0df5fd3