JS使用正则实现ReplaceAll全部替换的方法

作者:拾光

时间:2026-10-28

浏览:535

本文介绍在JavaScript中实现字符串全局替换的多种方案。原生replace()仅替换首个匹配项,通过添加正则全局标志g可实现全部替换。此外还探讨了使用RegExp构造函数、扩展String原型以及split结合join等技巧,帮助开发者灵活处理批量替换需求。

文章目录

JavaScript 中的字符串对象提供了 replace() 方法,但该方法的默认行为仅替换第一个匹配到的子串。

replace() 方法的主要功能是在字符串中用指定字符替换现有字符,或者替换与正则表达式匹配的子串。

其基本语法结构如下:

stringObject.replace(regexp/substr,replacement)

第一个参数可以是字符串或正则表达式,第二个参数则是用于替换的字符串或生成替换结果的函数。需要特别注意以下关键点:

当正则表达式包含全局标志 g 时,replace() 会替换所有匹配的子串;若未包含该标志,则仅替换第一个匹配项。

具体示例如下:

var str = "dogdogdog";
var str2 = str.replace("dog","cat");
console.log(str2);

上述代码仅替换了第一个 "dog",因此输出结果为 "catdogdog"。

参考以下代码片段:

<HTML>
<HEAD>
<TITLE> New Document </TITLE>
</HEAD>

<BODY>
<script>
var str = "wordwordwordword";
var strNew = str.replace("word","Excel");
alert(strNew);
</script>
</BODY>
</HTML>

若需实现全部替换,由于 JavaScript 早期版本未直接提供类似 Java 的 replaceAll() 方法,我们可以借助正则表达式来实现等效功能:

str.replace(/word/g,"Excel")

其中 g 标志的作用是执行全局匹配,即查找所有符合条件的子串,而不是在找到第一个匹配后停止。

<HEAD>
<TITLE> New Document </TITLE>
<script>
function replaceAll(str)
{
if(str!=null)
str = str.replace(/word/g,"Excel")
return str;
}
</script>
</HEAD>
<BODY>
<script>
var str = "wordwordwordword";
var strNew = str.replace("word","Excel");
strNew = replaceAll(str);
alert(strNew);
</script>
</BODY>
</HTML>

上述写法还有一种等效的替代方案:

str.replace(new RegExp("word","gm"),"Excel")

这里的 g 同样表示执行全局匹配,即查找所有匹配项而非仅第一个。

m 标志则表示执行多行匹配。

除此之外,还可以通过扩展 String 对象的原型来添加自定义方法:

String.prototype.replaceAll = function(s1,s2){ 
return this.replace(new RegExp(s1,"gm"),s2); 
}

经过上述扩展,即可像使用原生 replace 方法一样便捷地使用自定义的 replaceAll 功能。

str.replaceAll("word","Excel");

综上所述,主要有以下四种实现方式:

1. 使用带有全局标志 g 的正则表达式

var str = "dogdogdog";
var str2 = str.replace(/dog/g,"cat");
console.log(str2);

此方法可实现替换所有匹配字符串,最终输出结果为:catcatcat。

2. 使用另一种带有全局标志 g 的正则表达式写法

var str = "dogdogdog";
var str2 = str.replace(new RegExp("dog","gm"),"cat");
console.log(str2);

其输出结果与上一例相同。此处 g 代表执行全局匹配,m 代表执行多行匹配。

3. 为 String 对象添加原型方法 replaceAll()

String.prototype.replaceAll = function(s1, s2) {
    return this.replace(new RegExp(s1, "gm"), s2);
}

通过这种方式,即可像使用标准 replace 方法那样调用 replaceAll:

var str = "dogdogdog";
var str2 = str.replaceAll("dog", "cat");
console.log(str2);

其输出结果与前述示例一致。

4. 采用先 split 分割再 join 连接的方法

感谢评论区用户 @默默之 分享的这一巧妙方法,为避免遗漏,现将其纳入正文,特此致谢。

var str = "dogdogdog";
var str2 = str.split("dog").join("cat")
console.log(str2);

该方法的输出结果同样与前述示例相同。

补充说明:关于正则表达式,本站还提供了两款简便实用的在线工具供读者使用:

JavaScript 正则表达式在线测试工具:http://tools.jb51.net/regex/javascript

正则表达式在线生成工具:http://tools.jb51.net/regex/create_reg

至此,关于 JavaScript 使用正则实现 ReplaceAll 全部替换的介绍已结束,更多相关 JS ReplaceAll 内容请搜索本站历史文章或继续浏览下方相关文章,希望大家日后多多支持本站!

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章