关于JS 中字符串的 replace方法，第二个参数传入是函数时，该函数的参数设定解释

背景

无意中看到这么个面试题目：

如何将浮点数点左边的数每三位添加一个逗号，如12000000.11转化为『12,000,000.11』?

给出的答案是：

function commafy(num){
  	return num && num
  		.toString()
  		.replace(/(\d)(?=(\d{3})+\.)/g, function($1, $2){
  			return $2 + ',';
  		});
  }

 看到replace方法的第二个参数是个函数，顿时好奇，这个函数的参数是怎么设置的。

释疑

上网查了很多，看了w3cschool那一长串的解释，又看了网上其他各种说法的答案，在被绕晕之前，终于明白了。

举个并不能运行的例子：

stringObj.replace(/(a) (b) (c) (d)/, function(match, a, b, c, d, index, string) {
    console.log(match, a, b, c, d, index, stringObj);
    return match + '!';
});

第一个参数 match，返回被 整个正则 成功匹配的子字符串，必填。

而在整个正则表达式中，往往有0到多个被圆括号所圈起来的 子正则表达式，而match后面的 a, b, c, d 四个参数，正是依次对应正则表达式中，被四个子正则表达式 所匹配的四个字符串。

也就是说，整个正则表达式内，有多少个子正则，那么match后面，就依次跟着多少个对应的参数，非必填。

只有把前面的match、a、b、c、d...等参数全部填上，接下来的两个参数才会如下对应：

index参数，为match字符串在原字符串中 从左往右 数的所处位置，既所谓的偏移量，从0开始，非必填。

string，直接输出原字符串stringObj本身，非必填。

函数的返回值将被作为替换match字符串所用，如果没有显式返回，默认返回undefined。

所以，开头面试题给出的答案，其实是不严谨的。

正确的答案应该是：

function commafy(num){
  	return num && num
  		.toString()
  		.replace(/(\d)(?=(\d{3})+\.)/g, function($1, $2){
  			return $1 + ',';
  		});
  }

正则中的三个非捕获元 ?: 、?=、 ?!

另外顺便复习了一下正则中的 ?: 、?=、 ?!，这三个非捕获元必须放在()内，且在子正则表达式前面。

(?:) ： 取消 子正则 所匹配的缓存，如果后面没有用到 \n 这种形式的缓存引用，推荐加上，当然不加也不影响最终结果。

(?=) ： 一样会取消缓存，但还有一个含义是，整体匹配过程中必须能够通过该子正则表达式的匹配，但最终结果不输出该子正则表达式的匹配字符串。

例如：'123ac456ab'.match(/\d+(?=ab)/g)，输出 ["456"]，且不输出ab。

(?!) ：一样取消缓存，和上面 ?= 相反，子正则参与匹配，但整体匹配必须不包含该子正则表达式的匹配结果，最终结果也不输出该子正则表达式的匹配字符串。

例如：'123ac456ab'.match(/\d+(?!ab)/g)，输出 ["123", "45"]，因为 123和45的后续字符不等于ac，所以成功匹配。

结语

js中类似的刁钻角度数不胜数，偏偏面试还喜欢这么问……心累。

正则也很心累。