replace 第二个参数为函数的情况

时间:2022-01-12 11:27:32

replace()方法的第二个参数也可以是一个函数。在只有一个匹配项(即与模式匹配的字符串)的情况下,会向这个函数传递3个参数:模式的匹配项、模式匹配项在字符串中的位置和原始字符串。在正则表达式中定义了多个捕获组的情况下,传递给函数的参数依次是模式的匹配项、第一个捕获组的匹配项、第二个捕获组的匹配项……,但最后两个参数仍然分别是模式的匹配项在字符串中的位置和原始字符串。
例子:

//replace函数第二个参数是函数时,每个匹配都调用该函数,它返回的字符串将替换文本使用。
(function(window){
         function Fn(str){
                this.str = str;
         }
         Fn.prototype.format = function(){
                 console.log("arguments: ");
                 console.log(arguments);
                 //将类数组对象转化为数组
                 var arg = Array.prototype.slice.call(arguments,0);
                console.log(arg);

                return this.str.replace(/\{(\d+)\}/g,function(a,b,c,d){
                    console.log("a,b,c,d: ");
                    console.log(a);
                    console.log(b);
                    console.log(c);
                    console.log(d);
                    return arg[b-1]||"";                      
                      });
                };
              window.Fn = Fn;
}(window));

(function(){
            var  t = new Fn("<p><a href='{1}'>{2}</a><span>{3}</span></p>");
            console.log( t.format("http://www.alibaba.com","Alibaba","Welcome"));
            console.log(NaN !== NaN);//true
            console.log(NaN == NaN); //false
}());

输出结果为:

a,b,c,d: 
{1}
1
12
<p><a href='{1}'>{2}</a><span>{3}</span></p>
a,b,c,d: 
{2}
2
17
<p><a href='{1}'>{2}</a><span>{3}</span></p>
a,b,c,d: 
{3}
3
30
<p><a href='{1}'>{2}</a><span>{3}</span></p>
<p><a href='http://www.alibaba.com'>Alibaba</a><span>Welcome</span></p>
true
false