JS之正则表达式
正则表达式(英文:regular expression)，是一种符合某种语法规则的文本。同时可以理解为使用单个字符串来描述，匹配一系列的符合某种语法规则的字符串。许多语言都有着符合自己语法规范的正则表达式，如java，python，php，js。虽然这些正则不是完全一样，但也是大同小异。今天我想重点说的是JS中的正则表达式。
正则表达式的功能十分强大，能够熟练掌握它能够为平时的学习和工作带来不少的便利。虽然正则理解入门不是很难，但是真正地去掌握它并且熟练地运用起来却不是一件容易的事情。
学习正则有一个很好的在线的网站 https://regexper.com/ 。它可以帮助你更好的理解正则表达式中的一些关系。
正则表达式基础语法内容
1.1正则表达式的构造
在js中，正则表达式有两种构造方式。一种是常用的字面量表示法，即将正则字符串写在/(regexp)/
例如要匹配一个数字
var reg=/\d/;
还有一种是构造函数的方法，即new RegExp()。该方法有接收两个参数，第一个参数是正则字符串，第二个是匹配的模式(下文会讲)。但是第一个参数比较特殊，在转义字符时同时要转义转义字符，即若是用这种方法匹配一个数字，
var reg=new RegExp('\\d','g');
1.2正则表达式的匹配模式
常见匹配模式有三种，即全局匹配g，不区分大小写i，多行搜索匹配m。
'abcd'.replace(/[a-z]/,'1') //'1dcd' 只匹配一次 'abcd'.replace(/[a-z]/g,'1') //'1111' 都可以被匹配 'ABcd'.replace(/[a-z]/,'1') // 'AB1d' 'ABcd'.replace(/[a-z]/gi,'1') //'1111' 'a b c'.replace(/^[a-z]/,'1') //'1 b c' //换行符隔开 'a b c'.replace(/^[a-z]/m,'1') //'1 1 1'
2.正则表达式语法
2.1元字符
正则表达式由两种基本字符类型组成：①.原义文本字符，就是字符本身代表的意思。如 a 匹配 a ，1匹配1 ②.元字符，即正则中有特殊含义的非字母字符 如 * + ? $ ^ . | \ () {} []
元字符构成了许多有意义的特殊字符,例如 \t 水平制表符 \v垂直制表符 \n换行符 \r回车符 \0空字符 \f换页符
2.2字符类
一般情况下正则中一个字符匹配字符串中的一个字符，但是可以用元字符[]来构建一个符合某种特性的类，即符合这种特性的字符都可以被匹配。如[a,b,c]匹配a或b或c
'abcd'.replace(/[abc]/g,'d') //'dddd' 即abc都可以被匹配
2.2.1字符类取反
使用元字符^可以创建反向类，即不属于某种类的内容 如[^abc]匹配不是abc的字符
'abcde'.replace(/[^abc]/g,'x') //'abcxx' 即把不是abc的字符替换为x
2.2.2范围类
可以在[]中用-来连接两个字符表示范围 如[a-z]相当于[abcd.....xyz],[0-9]相当于[0123456789]，这样带来了许多便利。
在范围类的内部可以连写。如[a-zA-Z]匹配所有大小写字母。如果要匹配-则要在之后加上-，在两个字符之间的-表示范围。
'1970-01-01'.replace(/[0-9]/g,'a') //'aaaa-aa-aa' '1970-01-01'.replace(/[0-9-]/g,'a') //'aaaaaaaaaa'
2.2.3预定义类
①.可以匹配常见的字符类.
例如 .匹配除了回车符和换行符(\r\n)之外的所有字符 ；\d([0-9])匹配数字字符，\D([^0-9])匹配非数字字符；\s([\t\n\x0B\f\r])匹配空白符，\S([^\t\n\x0B\f\r])匹配非空白符；\w([a-zA-Z_0-9])匹配单词字符,\W([^a-zA-Z_0-9])匹配非单词字符.
②.边界匹配字符.如^ 表示以xxx开头(这里要注意区分开反向类,它在[]外,在[]内部表示取反) $表示以xxx结尾 \b表示单词边界 \B表示非单词边界。
2.3量词
量词表示可以匹配任意数量的字符串.如?表示匹配0次或1次，+表示匹配1次或多次，*表示匹配0次或多次 ，{n}表示匹配n次，{n，m}表示匹配n次到m次，{n，}表示匹配至少n次
'abcd'.replace(/[a-z]?/,'x') //'xbcd' 'abcd'.replace(/[a-z]+/,'x') //'x' 'abcd'.replace(/[a-z]*/,'x') //'x' 'abcd'.replace(/[a-z]{2,3}/,'x') // 'xd' 以上都是在贪婪模式下匹配返回的字符串，这是正则默认的匹配模式，下文会详细说明
2.4贪婪模式与非贪婪模式.
贪婪模式是正则表示式默认的匹配模式，即尽可能多的匹配字符。非贪婪模式则相反，尽可能少的匹配,一旦匹配成功则不再尝试。
贪婪模式如下
'12345678'.replace(/\d{3,6}/g,'0') //'078'
非贪婪模式，只需在量词后加上?就可以了。
'12345678'.replace(/\d{3,6}?/g,'0') //'0078'
2.5分组
①分组表示可以将不同的正则分为一组去匹配字符串。用()括起来的部分表示一个分组。如([a-z]\d)表示一个小写字母与一个数字为一组
'a1b2c3d4'.replace(/([a-z]\d){3}/g,'x') //'xd4'
②或,用 | 表示。例如
'cathatbat'.replace(/[c|h|b]at/g,'x') // 'xxx'
③反向引用,在正则中很重要的一个方法.$1,$2,$3...$n表示的是分组内的内容,分组上文讲过用()括起来的是一个分组,用$捕获分组内的内容,也叫捕获组。
如要将1970-01-01替换成01/01/1970
'1970-01-01'.replace(/(\d{4})-(\d{2})-(\d{2})/g,'$2/$3/$1')
// 01/01/1970
④忽略分组，若不希望捕获某些分组,只需要在分组内加上?: 就可以了
2.6前瞻后顾
前瞻就是正则表达式匹配到规则时，向前检查是否符合断言,后顾方向相反。JS中不支持后顾。
正向前瞻 exp(?=assert)
'a2*3'.replace(/\w(?=\d)/g,'x') //'x2*3'
负向前瞻 exp(?!assert)
'a2*3'.replace(/\w(?!\d)/g,'x') // 'ax*3'
3.RegExp对象
3.1.RegExp对象属性
global：是否全文搜索,默认为false，只读
ingore case：是否大小写敏感，默认为false，只读
multiline：是否多行搜索，默认为false，只读
lastIndex：当前表达式匹配内容的最后一个字符的下一个字符的位置，只在全局匹配中有作用
source：正则表达式的文本字符串
3.2.RegExp对象的相关方法
①.RegExp.prototype.test(str)
用于测试字符串参数中是否存在匹配正则表达式模式的字符串，存在返回true，不存在返回false
这里要注意一个问题，就是关于lastIndex指向问题
var reg=/\w/g ; reg.test('ab') //第一次 返回true 没问题 reg.test('ab') //第二次 返回true 没问题 reg.test('ab') //第三次 返回false 有问题
reg.test('ab') //第四次 返回true
while(reg.test('ab')){ console.log(reg.lastIndex); } // 1 2
正则表达式对象每次匹配都作用在正则表示式本身,每次匹配成功都会去根据lastIndex去寻找下一个字符是否匹配，若没有则lastIndex会被重置成0。
②.RegExp.prototype.exec(str)
使用正则表达式对字符串执行搜索，并将更新全局RegExp对象的属性以反映匹配结果。如果没有匹配的文本返回null，否则返回一个结果数组。
该结果数组中有两个特别的对象属性:
index:声明匹配文本的第一个字符的位置,
input:存放匹配的字符串
第一个元素是与正则表达式想匹配的文本
第二个元素是与RegExp对象的第一个子表达式想匹配的文本
第三个是与RegExp对象的第二个子表达式匹配的文本，以此类推
var reg1=/\d(\w)\d/; var reg2=/\d(\w)\d/g; var str='1a2b3c4d5e'; reg1.exec(str) //["1a2", "a", index: 0, input:"1a2b3c4d5e"] reg2.exec(str) //["1a2", "a", index: 0, input: "1a2b3c4d5e"]
4.字符串对象与正则相关的方法
①String.prototype.search(reg)
用于检索字符串中指定的子字符串,或检索与正则表达式相匹配的子字符串
返回第一个匹配结果的index，若查找不到则返回-1,
不执行全局匹配,忽略g标志。
'a1b2c3d1'.search(/1/) //1 'a1b2c3d1'.search(/1/g) //1 忽略g标志
②String.prototype.match(reg)
用于检索字符串,以找到一个或多个与regexp匹配的文本,是否具有g标志对结果影响很大
非全局调用
只执行一次匹配,没有找到匹配文本则返回null,否则返回一个数组,其中存放了与它找到匹配文本相关的信息。
该结果数组中有两个特别的对象属性:
index:声明匹配文本的第一个字符的位置,
input:存放匹配的字符串
第一个元素是与正则表达式想匹配的文本
第二个元素是与RegExp对象的第一个子表达式想匹配的文本
第三个是与RegExp对象的第二个子表达式匹配的文本，以此类推
这与RegExp对象的exec方法很类似，只是字符串与正则表达式的位子互换了。
全局调用
执行全局搜索,找到字符串中的所有匹配子字符串，没有找到返回null，否则返回一个数组,其中存放了与它找到匹配文本的相关信息。
该结果数组中有两个特别的对象属性:
index:声明匹配文本的第一个字符的位置,
input:存放匹配的字符串
数组中的元素存放的是字符串中所有的匹配到的子字符串
③String.prototype.split(reg)
split方法是我们熟悉的方法,我们经常用split将一个字符串分割成一个数组,同样的这个分割符可以是一个正则表达式.
'a1b2c3d'.split(/\d/g) //["a", "b", "c", "d"]
④.String.prototype.replace()
这个方法是特别重要也相对较复杂的方法，功能特别强大的一个方法。
它有两个参数，第一个参数是需要被替换的字符串,第二个参数是用来替换的字符串。
它有三种使用方法
String.prototype.replace(str,newStr),
String.prototype.replace(reg,newStr),
String.prototype.replace(reg,function)
重点就在于String.prototype.replace(reg,function)
function的返回值是替换结果.这个function在每次匹配替换的时候被调用,有四个参数
1.匹配的字符串
2.正则表达式分组内容，没有分组则没有该参数
3.匹配项在字符串中的index
4.原字符串
//没有分组的情况
'a1b2c3d4'.replace(/\d/g,function(match,index,origin){ return parseInt(match)+1; }) //"a2b3c4d5"
//有分组的情况
'a1b2c3d4'.replace(/(\d)(\w)(\d)/g,function(match,group1,group2,group3,index,origin){ return group1+group3; }) //"a12c34"
以上就是正则表达式的大部分内容。正则表达式功能很强大,能熟练应用会给我们带来很多便利。
