js中的正则表达式小结

前言

虽然有朋友说，正则不需要会，很多规则网上都可以搜到现成的，但是我个人觉得起码要明白基本的规则原理，正则中的元字符的含义，这样搜规则的时候也可以选择最优最适合需求的规则。

正则表达式的概念

正则表达式是由普通字符和特殊字符（元字符）组成的对字符串过滤的逻辑公式。

正则表达式创建方式

（1）字面量定义方式：

var reg = / abc /;

（2）构造函数：

var reg = new RegExp( "abc" ， g);

第二个参数为可选参数，用来修饰正则表达式，比如元字符gi等。

可使用正则表达式的方法：

（1）RegExp的reg.test( )方法：

用来检测某个字符串中是否含有某个子串（正则定义），返回true或false。

var reg = (/adf/);
reg.test('fadfadsfad');//true,只要被检测的字符串中（‘fadfadsfad'）包含有我们定义的字符串( 'adf' )，即会返回true。

（2）RegExp的reg.exec( )方法：

返回一个数组（类数组对象），包含匹配成功的内容。若未匹配成功，返回null。

var reg = (/day/gi);
 dreg.exec('Day by day, day after day.');
返回值为：
["Day", index: 0, input: "Day by day, day after day.", groups: undefined]
返回的匹配成功内容的数组的第一索引位的值是符合规则的子串，index为匹配到的子串在被匹配字符串中的起始位置。

在reg.exec( )方法中，如果加了g元字符代表在被检测的字符串中全局匹配，会有一个有意思的现象，即上一次的操作结果会对下一次的操作结果造成影响。

var reg = (/day/gi);
console.log(reg.exec('Day by day, day after day.'));
console.log(reg.lastIndex);
console.log(reg.exec('Day by day, day after day.'));
console.log(reg.lastIndex);
console.log(reg.exec('Day by day, day after day.'));
console.log(reg.lastIndex);
console.log(reg.exec('Day by day, day after day.'));
console.log(reg.lastIndex);
console.log(reg.exec('Day by day, day after day.'));
console.log(reg.lastIndex);

返回的值为：
可以
从上图的返回结果中我们可以看到，每一次的reg.lastIndex 都是为上一次匹配到的子串在原字符串中的末尾索引值，如若想避免这个影响，可在每一次检测结束后设置reg.lastIndex = 0;

（3）Stirng.match( )方法：

在字符串中查找符合规则的子串，并将符合规则的子串以数组形式返回，若匹配失败则返回null。

var str = 'Day by day,day after day.';
var reg = /day/gi;
console.log(str.match(reg));
打印值为：
["Day", "day", "day", "day"]

需要注意的是，match方法依赖于reg规则的全局g属性，如果我们不设置reg有g会怎样呢？

var str = 'Day by day,day after day.';
var reg = /day/i;
console.log(str.match(reg));
打印值为：
["Day", index: 0, input: "Day by day,day after day.", groups: undefined]

如上面的结果所示，只会返回包含第一次匹配到的子串，索引位的一个类数组对象。

（4）String.matchAll ( )

该方法返回一个包含所有匹配正则表达式的结果及分组捕获组的迭代器（不可重用，结果耗尽需要再次调用方法，获取一个新的迭代器）。

let regexp = /t(e)(st(\d?))/g;
let str = 'test1test2';

let array = [...str.matchAll(regexp)];

console.log(array[0]);
// expected output: Array ["test1", "e", "st1", "1"]

console.log(array[1]);
// expected output: Array ["test2", "e", "st2", "2"]

（5）String.search ( )

该方法返回返回正则表达式在字符串中首次匹配项的索引，如若匹配失败则返回-1。

var str = 'Day by day,day after day.';
var reg = /day/i;
console.log(str.search(reg));
打印值为：0

var str = 'Day by day,day after day.';
var reg = /money/gi;
console.log(str.search(reg));
则打印值为： -1

（6）String.replace ( reg | str ,newStr | functiong)

该方法用指定的字符串替换掉首个匹配到的子串，原字符串不会改变，返回值为新的字符串。

var str = 'Day by day,day after day.';
var reg = /day/i;
console.log(str.replace(reg,'money'));
打印值为：‘money by day,day after day.’

若想进行全局替换，需加全局标志g.
var str = 'Day by day,day after day.';
var reg = /day/gi;
console.log(str.replace(reg,'money'));
打印值为：‘money by money,money after money.’

（7）String.split ( )

一个使用正则表达式或者一个固定字符串分隔一个字符串，并将分隔后的子字符串存储到数组中的 String 方法。

var str = 'Day by day,day after day.';
var reg = /day/gi;
console.log(str.split(reg));
打印值为：["", " by ", ",", " after ", "."]

方法小结：
如果想测试一个字符串中是否包含某个字符串可以用test和search方法；如果想得到所有的符合规则的字符串可以使用match+g或matchAll方法；如果想同时得到符合规则的字符及其索引位可用exec方法。

常用元字符

（1）g

g表示全局匹配

var str = 'Day by day,day after day.';
var reg = /day/g;
console.log(str.match(reg));
此时打印值为：["day", "day", "day"]

如果不加g呢？
var str = 'Day by day,day after day.';
var reg = /day/;
console.log(str.match(reg));
打印值为：["day", index: 7, input: "Day by day,day after day.", groups: undefined]
此时，只能匹配到第一个符合规则的子串。

（2）i

i代表的是忽略大小写。

首先，不加i的匹配规则
var str = 'Day by day,day after day.';
var reg = /day/;
console.log(str.match(reg));
打印值为：["day", index: 7, input: "Day by day,day after day.", groups: undefined]
可以看到，匹配到的子串的开始索引位为7.
那加了i呢？
var str = 'Day by day,day after day.';
var reg = /day/i;
console.log(str.match(reg));
则此时的打印结果为：["Day", index: 0, input: "Day by day,day after day.", groups: undefined]
匹配到的子串为‘Day’，开始索引位为0.

（3）.

.元字符代表的是除了换行符之外的所有字符。

var str = 'Day by dby,dcy after d7y.';
var reg = /d.y/gi;
console.log(str.match(reg));
打印值为：["Day", "dby", "dcy", "d7y"]

（4）*

该元字符代表的是该符号之前的字符出现0-n次。

var str = 'Daaaay';
var reg = /d.*y/gi;
console.log(str.match(reg));
打印值为：["Daaaay"]

var str = 'Dy';
var reg = /d.*y/gi;
console.log(str.match(reg));
打印值为：["Dy"]，这是因为*代表的是0-n次，即表示*字符前字符也可以不出现。

（5）+

+号表示至少出现一次，即1-n。

此时我们看一下*号元字符的第二个例子：
var str = 'Dy';
var reg = /d.+y/gi;
console.log(str.match(reg));
此时的打印值为：null
这是因为+代表的是前边的字符至少出来一次，即y前应该至少有一个除换行符以外的任何一个字符。

var str = 'D1y';
var reg = /d.+y/gi;
console.log(str.match(reg));
此时打印值为：["D1y"]

（6）[ ]

**[ ]**表示可以出现的字符的范围。
[0-9]：表示数字
[a-z]：表示小写字母
[A-Z]：表示大写字母
[0-9a-zA-Z_]：表示数字字母下划线

var str = 'Dy';
var reg = /d[0-9a-zA-Z_]*y/gi;
console.log(str.match(reg));
打印值为：["Dy"]

var str = 'Da1_y';
var reg = /d[0-9a-zA-Z_]*y/gi;
console.log(str.match(reg));
打印值为：["Da1_y"]

（7）\w 与 \W

\w等价于[0-9a-zA-Z_]，代表数字字母下划线。
\W代表非数字字母下划线以外的字符。

var str = 'Da1_y';
var reg = /d\w*y/gi;
console.log(str.match(reg));
打印值仍为：["Da1_y"]

（8）\d 与 \D

\d 代表数字，等价于[0-9]。
\D代表非数字。

（9）{ }

{ }代表出现的次的范围。

{n} ：代表一个字符出现n次。
{n ,}：代表一个字符至少出现n次。
{n,m}：代表一个字符出现n-m次。

var str = 'Da1_y';
var reg = /d\w{3}y/gi;
console.log(str.match(reg));
打印值仍为：["Da1_y"]

var str = 'Da123131_y';
var reg = /d\w{3,}y/gi;
console.log(str.match(reg));
打印值为：["Da123131_y"]

var str = 'Da123131_y';
var reg = /d\w{3,5}y/gi;
console.log(str.match(reg));
打印值为：null，因为d和y之前出现的字符数字_次数为8次。

（10）^ 与 $

^：匹配开始。
$：匹配结束。

var str = 'Da123131_y';
var reg = /^d.*y$/gi;
console.log(str.match(reg));
打印值为：["Da123131_y"]，这个正则规则的含义是指以d/D字母开头以y/Y结尾，且中间的字符除换行为之外的所有字符。

（11）\s

\s 代表的是空格。

var str = 'Day by day,day after day.';
var reg = /\s/g;
console.log(str.split(reg));
打印值为：["Day", "by", "day,day", "after", "day."]

（12）\b

\b：匹配是否到了边界，把str当做一个单词进行搜索。

var str = 'Day by bday,day after day4.';
var reg = /day\b/gi;
console.log(str.match(reg));
打印值为：["Day", "day", "day"]，即只会匹配大小写的day这个单词，并非匹配包含day的字符。

（13）|

|：代表或者的意思，匹配其中一种字符。

var str = 'Day by day,day after day.';
var reg = /by|after/g;
console.log(str.match(reg));
打印值为：["by", "after"]

（14）（）

（）：代表将内容进行分组，可作为一个整体进行多次匹配。

var str = 'daydaydayndayday';
var reg = /(day){4,8}/; //意思是匹配day字符4-8次，且须连续。
reg.test(str);
结果为：false。
若删除中间的n:
var str = 'daydaydaydayday';
var reg = /(day){4,8}/;
reg.test(str);
结果则为：true