JS 正则替换核心就是使用字符串的 replace 方法，搭配正则表达式，把匹配到的内容替换成指定文本，基础语法是str.replace(正则, 替换内容)，默认情况下如果正则没有加全局修饰符 g，只会替换第一个匹配项，想要全文所有匹配都替换，必须加上 g 全局标记，很多新手踩坑就是忘记写 g，导致只替换一处，replace 还支持回调函数，可以拿到捕获分组，做复杂动态替换，除了简单固定文本替换，还可以利用 $1 $2 引用捕获组，这是 JS 正则替换非常常用的高级用法，本篇会讲解基础语法、修饰符、捕获组引用、回调函数替换、常见实战案例，同时说明常见报错和坑点。

核心语法对照表

常用修饰符清单

1 g global 全局匹配，替换所有符合项

2 i ignoreCase 忽略大小写

3 m multiline 多行模式，^ $ 匹配每一行首尾

捕获组特殊符号

$& 代表整个匹配到的字符串

$1 第一个括号捕获分组

$2 第二个括号捕获分组

基础代码示例

const str = "hello 123 hello 456"

// 只替换第一个hello

const res1 = str.replace(/hello/, "你好")

// 全局替换所有hello

const res2 = str.replace(/hello/g, "你好")

console.log(res2)

捕获组替换案例

把手机号中间四位替换成星号

const phone = "13812345678"

const newPhone = phone.replace(/(\d{3})\d{4}(\d{4})/, "$1$2")

console.log(newPhone) // 1385678

回调函数动态替换

const text = "a1 b2 c3"

const result = text.replace(/(\w)(\d)/g, function(match, char, num){

return char + Number(num)10

})

常见实战场景

1 去除字符串所有空格

str.replace(/\s+/g, "")

2 替换 html 标签

str.replace(/<[^>]+>/g, "")

3 统一换行符

str.replace(/\r\n|\r|\n/g, "
")

4 敏感词替换

str.replace(/敏感词/g, "")

重要踩坑步骤

第一步，确认是否需要全部替换，忘记 g 只会替换第一个匹配项

第二步，正则里面特殊字符需要转义，比如 . + ? () [] ^ $ \ ，如果要匹配本身，前面加反斜杠

第三步，replace 不会修改原字符串，它返回新字符串，原字符串保持不变，这个是高频误区

第四步，如果正则是字符串形式创建，需要双重转义，new RegExp("\\s+","g")

综合总结，js 正则替换就是调用 replace，搭配正则表达式，全局替换记得加 g 标记，复杂场景可以使用捕获组 $1 或者回调函数动态生成替换内容，replace 返回新字符串，不会改动原始字符串。

【常见问题】

问题 1 js 正则替换为什么只替换第一个

回答 1 js 正则替换只替换第一个，是因为正则没有加 g 全局修饰符，js 正则替换加上 /g 之后，就可以匹配全部内容完成全局替换。

问题 2 js 正则替换会修改原来的字符串吗

回答 1 js 正则替换不会修改原字符串，js 正则替换的 replace 方法返回一个全新字符串，原始字符串保持不变，需要用变量接收返回结果。

问题 3 js 正则替换里面 $1 是什么意思

回答 1 js 正则替换里面 $1 代表正则第一个括号捕获分组，js 正则替换可以使用 $1 $2 这种语法，引用分组内容拼接新的替换文本。

【免责申明】

本文属于前端 JS 技术科普，正则语法遵循 ECMAScript 标准，不同浏览器内核基础正则兼容基本一致，部分高级正则特性存在版本差异，代码仅作学习参考，不代表其他立场。