JavaScript正则表达式深入理解

正则表达式在很多场景和需求中都能用得上，而且很多情况下使用正则表达式能够让代码更加轻松简洁，特别是在我们判断输入的时候，非常好用。

正则就是用来处理字符串的，匹配字符串的格式是否符合既定的格式（正则的匹配），把一个字符串中符合既定格式的内容获取（正则捕获）；test和exec是正则里面的方法，test->匹配：

var reg = /\d/;// \d一个0-9之间的数字
console.log(reg.test('2016'));// true
console.log(reg.test('asda123'));//true
console.log(reg.test('asd'));//false

exec->捕获：

var reg = /\d/g;
console.log(reg.exec("2016"));//["2",index: 0,input: "2016";]
console.log(reg.exec("2016"));//["0",index: 1,input: "2016";]
console.log(reg.exec("2016"));//["1",index: 2,input: "2016";]
console.log(reg.exec("2016"));//["6",index: 3,input: "2016";]

正则的组成：每个正则都是由元字符和修饰符组成，“/”里面的内容成为元字符，“/”[修饰符]g,i,m

g：global，全局匹配；

i：ignoreCase，忽略大小写；

m：multiline，换行匹配。

正则常用字符：

\d	匹配一个0-9的数字，相当于[0-9]，相反的是/D，匹配一个非0-9的字符；
\w	匹配一个0-9，a-z，A-Z，_中的数字或者字符，相当于[0-9a-zA-Z_；相反的\W
\s	匹配一个空白字符，比如空格，制表符；相反的是\S
\t	匹配一个制表符；
\b	匹配一个单词的边界；
\n	匹配一个换行符；
.	匹配一个除了\n以外的任意字符；
^	匹配某一个元字符开头；/^a/匹配"an A"，而不匹配"An a"
$	以某一个元字符结尾；/a$/匹配"An a"，而不匹配"an A"
\	转义字符；
x|y	x或者y中的一个；
[xyz]	xyz中任意一个；
[^xyz]	除了xyz中的任意一个字符，/ba*/将匹配ba,baa,baaa
+	出现一次或多次，即不为0次,
*	匹配出现0次或多次，/ba*/将匹配b,ba,baa,baaa
?	匹配出现0次或1次，/ba？/将匹配b,ba
{n}	精确出现n次
{n,}	匹配n次以上
{n,m}	匹配n到m次

代码尝试：

var reg = /\d+/g;    //包含1个以上的数字
console.log(reg.test("asd2016"));//->true

var reg = /^\d+$/;//->只能是一到多个数字
console.log(reg.test("asd2016"));//->false
console.log(reg.test("2016"));//->true

var reg = /^2.6$/g;
console.log(reg.test("2.6"));//true
console.log(reg.test("2&6"));//true

var reg = /^2\.6$/g;
console.log(reg.test("2.6"));//true
console.log(reg.test("2&6"));//false,因为.已经被转义为小数点，而不是元字符

//在中括号中出现的所有字符(不管之前代表什么意思),在这里都是只代表本身的意思
var reg = /^[2.3]$/;//->.这里只代表小数点,不是任意字符了
var reg = /^[\dz]$/;//->\d本身整体就是0-9之间的数字,在这里还是这个意思


//在中括号中出现的两位数不是一个两位数，而是左边或者右边的
var reg = /^[10-23]$/;//1或者0-2或者3
//x|y
var reg = /^1|2$/;//->和这个有区别:/^[12]$/
//可以是1、2、12
var reg = /^10|28$/;
//可以匹配10、28、1028、102、108、128、028 ->不是我们想要的那个10或者28了
//这里可以使用 () 来进行分组
var reg = /^(10|28)$/;//就会匹配10或者28
//()还能进行分组引用
var reg = /^[a-z]([a-z])\1[a-z]$/i;//\1出现和第一个分组一模一样的内容

正则的创建有2种方式，可以是reg = new RegExp("^\\d+$","ig");相当于 reg = /^\d+$/ig，可以看到，如果是使用实例创建的话，对于\d,\w,\s等都需要多加一个\，使得\d具有自己的特意义。

下面是一些常用的正则表达式：

手机号，11位数字的，一般都是1开头：

var reg = /^1\d{10}$/;

真实姓名，2个到4个汉字：

var reg = /^[\u4e00-\u9fa5]{2,4}$/

邮箱验证：

var reg = /^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$/

var reg1 = /^[\w.-]+@([1-9]|[a-z]|[A-Z])+(\.[A-Za-z]{2,4}){1,2}$/

年龄验证，18-65：

var reg = /^((18|19)|(^[2-5]\d$)|(^6[0-5]$))$/

正则捕获：

正则捕获分为2各阶段，首先是匹配，如果匹配不成功则捕获的结果为null；

然后是捕获，对正则匹配到的内容捕获，捕获成功返回的结果是一个数组，第一项是捕获的内容，index是捕获开始的索引位置，input是捕获的原始字符串，每一次exec都只能捕获一个匹配的，想把所有匹配的内容捕获，那就需要运行多次exec，但是一般情况下，捕获到的内容都是一样的。因为reg.lastIndex：正则每一次捕获的时候都在字符串中开始查找的索引，每一次正则捕获后都默认不会修改reg.lastIndex，所以每一次捕获都会从头开始查找，所以也就只会捕获到一样的内容。

所以如果想能够实现多次匹配，就需要使用到一个字符串提供的方法match，string.match(reg)，这样就能够全部捕获匹配内容，但是match方法也有局限，如果正则中出现分组，而且需要多次执行exec才能全部捕获，使用match不能把分组内容捕获到，这里就要介绍下比较完美的方案，就是字符串提供的方法replace！

replace可接受2个参数，replace([RegExp|String],[String|Function])

第1个参数可以是一个普通的字符串或是一个正则表达式

第2个参数可以是一个普通的字符串或是一个回调函数

如果第1个参数是RegExp, JS会先提取RegExp匹配出的结果，然后用第2个参数逐一替换匹配出的结果

如果第2个参数是回调函数，每匹配到一个结果就回调一次，每次回调都会传递以下参数：

result: 本次匹配到的结果，也就是arguments[0]
 
$1,...$9: 正则表达式中有几个()，就会传递几个参数，$1~$9分别代表本次匹配中每个()提取的结果，最多9个,也就是arguments[1]-arguments[9] 

offset:记录本次匹配的开始位置

 source:接受匹配的原始字符串

下面给一段代码：

var str = "2018-11-08";
let reg = /^([1-2]\d{3}$)-(0?[0-9]|1[1-2])-([0-2]\d|3[0-1])$/
console.log(reg.test(str));//true
str.replace(reg,function(){
   console.log(arguments)
   return arguments[1] + '年' +arguments[2] + '月' + arguments[3] + '日'
})
function format(str){
  var reg = /^([1-2]\d{3}$)-(0?[0-9]|1[1-2])-([0-2]\d|3[0-1])$/
  if(!reg.test(str)){ return '输入不合法'}
  return (str.replace(reg,function(){
         // console.log(arguments)
          return arguments[1] + '年' +arguments[2] + '月' + arguments[3] + '日'
}))
}
console.log(format('2018-12-30'))   -> '2018年12月30日

数字大写转换：

var str = "12345678";
var arr = ["零", "壹", "贰", "叁", "肆", "伍", "陆", "柒", "捌", "玖"];
str = str.replace(/\d/g,function(){
  return arr[arguments[0]]//argument[0]就是str这个变量
})

简易模板引擎实现：

var arr = ['cj', '24', 'china', 'javascript']
var str = "my name is {0}，my age is {1}，i com from {2}，i can do {3}~~";
var reg = /\{(\d)\}/g
console.log(reg.test(str))
str = str.replace(reg, function(){
  return data[arguments[1]]
})

参考链接：https://juejin.im/post/5acb4d3f6fb9a028c813295e