js正则表达式

1、基本概念

正则表达式：使用单个字符串来描述、匹配一系列符合某个句法规则的字符串。

即：按照某种规则去匹配符合条件的字符串

2、RegExp对象

js通过内置对象RegExp支持正则表达式，有两种方法实例化RegExp对象。

• 字面量
• 构造函数

案例1：匹配字符创中小写的is变为大写的is

// 字面量方式
let reg = /\bis\b/g;
   "He is a boy. This is a dog. Where is she?".replace(reg, "IS");
//控制台输出"He IS a boy. This IS a dog. Where IS she?"
// \b标识单词边界，表示这里匹配的is是一个完整的单词，而不是this中的is，
// \g表示全文搜索匹配。

// 构造函数方式
let reg = new RegExp("\\bis\\b", "g");//\\b表示转义\b
   "He is a boy. This is a dog. Where is she?".replace(reg, "IS");
// 控制台输出"He IS a boy. This IS a dog. Where IS she?"

3、元字符

正则表达式由两种基本字符类型组成：

• • 原义文本字符：如“abc”,"hello"
  • 元字符：如 “\b”

元字符是在正则表达式中有特殊含义的非字母字符，其中包括 * + ? $ ^ . | \ ( ) { } [ ]

4、字符类

类：指符合某些特性的对象，一个泛指，而不是特指某个字符。一般使用“[ ]”类构建。

案例：

"a1b2c3d4".replace(/[abc]/g, "X");//控制台输出"X1X2X3d4"
// 把字符串中的a或者b或者c替换成X

"a1b2c3d4".replace(/[^abc]/g, "X");//控制台输出"aXbXcXXX"
// 使用^创建反向类,指不属于某类的内容

5、范围类

类似于 [ a-z ] ,来连接两个字符表示从a到z的任意字符，这是个闭区间，包含a，z本身。

"a1b2c3d4z9".replace(/[a-z]/g, "Q");//控制台输出"Q1Q2Q3Q4Q9"
// 所有a-z的字母替换成Q。

也可以连写 [ a-zA-Z ] 匹配范围内的大小写 
"a1b2c3d4z9ASDFG".replace(/[a-zA-Z]/g, "Q");//控制台输出"Q1Q2Q3Q4Q9QQQQQ"
// 所有的包括大小写的a-z的字母替换成Q

6、预定义类及边界

正则表达式提供预定义类来匹配常见的字符串。

如：匹配一个ab+数字+任意字符的字符串。

如果是之前的思路，大概要这么写 ab[0-9][^\r\n] 。现在写成 ab\d. 就可以了。

正则表达式还提供了几个常用的边界匹配字符。如前面见到的\b。

案例

"@123@abc@".replace(/^@./g, "Q");//控制台输出"Q23@abc@"
"@123@abc@".replace(/.@$/g, "Q");//控制台输出"@123@abQ"
// 分别将以@+任意字符开头的和以任意字符+@结尾的字符串替换成Q。

7、量词

PS：{ n,m }，逗号后面没有空格！

案例：

\d{20}\w\d?\w+\d*\d{3}\w{3,5}\d{3,}

• \d{20}表示出现20个连续的数字
• \w表示出现1个单词字符
• \d?表示紧跟着出现最多出现1次的数字
• \w+表示出现至少1次的单词字符
• \d*表示出现任意次的数字
• \d{3}表示出现3个连续的数字
• \w{3,5}表示出现3-5次单词字符
• \d{3,}表示至少再出现3个连续的数字

8、正则贪婪模式与非贪婪模式

有这样一个字符串"12345678"，对其进行这样的正则匹配\d{3,6}，看看会匹配多少个。

"12345678".replace(/\d{3,6}/g, "X");//控制台输出"X78"
// 可见，前6个数字被替换成了X

正则表达式会尽可能多的去匹配，这就是正则的贪婪模式。

如果我们只想让它匹配3个，怎么做呢？这就是正则的非贪婪模式，做法很简单，在量词后加上?即可。

"12345678".match(/\d{3,6}?/g, "X");//控制台输出"XX78"
// 可见，每3个数字被替换成了一个X

9、分组

要匹配字符串Byron连续出现3次的场景

1：ByronByronByron // 麻烦

2：Byron{3} // 只会匹配三次n,而不是Byron

利用分组，这个场景可以写成(Byron){3},就可以匹配三次Byron了。

"a1b2c3d4".replace(/([a-z]\d){3}/g, "X");
//控制台输出"Xd4"

表示“或”关系，可以用 | ，

"ByronsperByrCasper".replace(/Byr(on|Ca)sper/g, "X");
//控制台输出"XX"

在处理时间日期的时候，经常需要我们把2017-12-25替换成12/25/2017，这里可以使用反向引用，通过$1-$n来捕获第1-n个分组。

"2017-12-25".replace(/(\d{4})-(\d{2})-(\d{2})/g, "$2/$3/$1");
// 控制台输出"12/25/2017"

如果不希望捕获某些分组，只需要在分组内加上?:。如(?:Byron).(ok)

10、前瞻

前瞻就是在正则表达式匹配到规则的时候，向前检查是否符合断言，后顾方向相反。

Javascript不支持后顾。

匹配一个单词字符且后面是数字的场景，\w(?=\d)。

11、字符串对象方法

search()方法用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串。方法返回第一个匹配结果的index，查找不到返回-1。search()方法不执行全局匹配，并且总是从字符串的开始进行检索。

"a1b2c3d1".search("1");//控制台输出1
"a1b2c3d1".search(1);//控制台输出1
"a1b2c3d1".search(/1/g);//控制台输出1

match()方法将检索字符串，以找到一个或多个与正则表达式相匹配的文本。正则表达式是否具有标志g对结果影响很大。

没有标志g，那么match()方法就只能在字符串中执行一次匹配，如果没有找到任何匹配的文本，将返回null，否则它将返回一个数组，其中存放了与它找到的匹配文本有关的信息。

有标志g，那么match()方法将执行全局检索，找到字符串中的所有匹配子字符串。

split()方法可以将字符串分割为字符数组。

"a1b2c3d4e".split(/\d/g);
// 控制台输出["a", "b", "c", "d", "e"]

replace()方法用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。

替换的内容可以是一个函数function，function会在每次匹配替换的时候调用，有4个参数

• 匹配字符串 (match)
• 正则表达式分组内容，没有分组则没有该参数 (group)
• 匹配项在字符串中的index (index)
• 原字符串 (origin)

"a1b2c3d4e5".replace(/\d/g, function(match, index, origin){
       	console.log(index);// 控制台打印1 3 5 7 9
       	return parseInt(match) + 1;// 控制台打印"a2b3c4d5e6"
    	});
// a1b2c3d4e5中的1 2 3 4 5 被替换为2 3 4 5 6

"a1b2c3d4e5".replace(/(\d)(\w)(\d)/g,
    function(match, group1, group2, group3, index, origin){
       console.log(match);// 控制台打印1b2 3d4
       return group1 + group3;// 控制台打印"a12c34e5"
    }
); 
// a1b2c3d4e5中1b2被替换为"1"+"2"得到的"12",3d4被替换为"3"+"4"得到的"34"