JavaScript String replace 方法全解析：从基础替换到高级回调函数

replace 方法基础语法与返回值

replace 方法是 JavaScript 字符串处理中较为复杂且常用的方法，严格来说它属于 String 对象的方法，但在涉及正则表达式操作时最为常见，需要开发者灵活运用。

其标准语法格式为：stringObj.replace(regexp/substr, replacement)。

第一个参数是必需的，可以是用于匹配的子字符串或正则表达式 RegExp。

第二个参数也是必需的，指定用于替换的文本字符串，或者是一个生成替换文本的函数。

需要注意的是，replace 方法返回一个新的字符串，原字符串不会被修改。新字符串是用 replacement 替换掉 regexp 的第一次匹配（若无全局标志 g）或所有匹配后得到的结果。

根据参数的不同组合，replace 方法呈现出多种行为模式，以下将对各种情况进行逐一分析。

字符串与正则的基础替换

情况一：两个参数均为字符串。

var str1 = '这是一段原始文本，需要替换的内容"这要替换"！';
var newStr = str1.replace('这要替换','need replace');
console.log( newStr );  //输出：  这是一段原始文本，需要替换的内容"need replace"！

在此情况下，第二个参数字符串 'need replace' 直接替换第一个参数字符串 '这要替换'。这是最简单直接的替换形式，对应代码示例展示了将原文中的特定子串替换为新字符串的过程。

情况二：第一个参数为正则表达式，第二个参数为字符串。

var str2 = '这是一段原始文本，需要替换的内容"ac这要替换bb"！';
var newStr = str2.replace( /([a-z])+/g,'qqq' );
console.log( newStr );  //输出：  这是一段原始文本，需要替换的内容"qqq这要替换qqq"！

此时，正则表达式匹配的内容被第二个参数字符串 'qqq' 替换。如果正则表达式带有全局标志 g，replace() 将替换所有匹配的子串；否则，仅替换第一个匹配项。代码示例演示了使用全局正则替换多个匹配项的效果。

$ 符号与子表达式的引用规则

情况三：第一个参数为正则表达式，第二个参数为包含 $ 符号的特殊字符串。

var str3 = '这是一段原始文本,"3c这要替换4d"!';
var newStr = str3.replace( /([0-9])([a-z])/g,"$1" );
console.log( newStr );  //输出：  这是一段原始文本,"3这要替换4"!';

在替换字符串中，$1 表示正则中第一个子表达式（如 ([0-9])）所匹配的内容，$2 表示第二个子表达式（如 ([a-z])）所匹配的内容。例如，'3c' 被第一个子表达式匹配的数字 '3' 替换，'4d' 被 '4' 替换。其他类似情况也可依此类推。

具体示例包括：使用 /([0-9])([a-z])/g 和 "$2" 时，'3c' 和 '4d' 分别被对应的字母 'c' 和 'd' 替换；使用 "$'" 时，'3c' 被其右侧文本替换，'4d' 也被其右侧文本（即 '!'）替换，从而产生重复的 '!'。

使用回调函数进行动态替换

情况四：第一个参数为正则表达式，第二个参数为函数。

var str4 = '这是一段原始文本，需要替换的内容"aa这要bbb替换ccccc"！';
var newStr = str4.replace( /[a-z]+/g,function ($0){
  var str = '';
  for (var i = 0; i < $0.length; i++) {
    str += '*';
  };
  return str;
} );
console.log( newStr );  //这是一段原始文本，需要替换的内容"**这要***替换*****"！

在此模式下，回调函数的第一个参数为正则匹配的整体字符串。函数根据该参数（如长度）返回相应的替换文本。代码示例展示了如何将匹配到的字母字符串转换为等长度的星号字符串。

情况五：第一个参数为包含子表达式的正则表达式，第二个参数为带有多个参数的回调函数。

var str5 = '这是一段原始文本，需要替换的内容"3c这要替换4d"！';
var newStr = str5.replace( /([0-9])([a-z])/g,function (arg1,arg2,arg3,arg4,arg5){
 console.log( arg1 );
 console.log( arg2 );
 console.log( arg3 );
 console.log( arg4 );
 console.log( arg5 );
} );

输出结果展示了回调函数各参数的具体值。

3c 3 c 17 这是一段原始文本，需要替换的内容"3c这要替换4d"！ 4d 4 d 23

原始文本为：这是一段原始文本，需要替换的内容"3c这要替换4d"！。

在回调函数中，第一个参数 arg1 表示匹配的整体字符串，arg2 表示第一个子表达式的匹配结果，arg3 表示第二个子表达式的匹配结果。随后的参数 arg4 是一个整数，表示子匹配在 stringObject 中出现的位置。最后一个参数 arg5 是 stringObject 本身。

综上所述，replace 方法涵盖了多种参数组合情况，是一个功能强大但需要深入理解的方法，值得开发者进行深入研究。