正则表达式的创建方式以及区别
pattern:正则表达式
flags:标识(修饰符)
标识主要包括：
1. i 忽略大小写匹配
2. m 多行匹配，即在到达一行文本末尾时还会继续寻常下一行中是否与正则匹配的项
3. g 全局匹配 模式应用于所有字符串，而非在找到第一个匹配项时停止
字面量创建方式
1
| var reg = /pattern/flags
|
实例创建方式
1
| var reg = new RegExp(pattern,flags);
|
字面量创建方式和构造函数创建方式的区别
1.字面量创建方式不能进行字符串拼接，实例创建方式可以
1
2
3
4
5
| var regParam = 'cm';
var reg1 = new RegExp(regParam+'1');
var reg2 = /regParam/;
console.log(reg1);
console.log(reg2);
|
2.字面量创建方式特殊含义的字符不需要转义，实例创建方式需要转义
1
2
3
| var reg1 = new RegExp('\d');
var reg2 = new RegExp('\\d')
var reg3 = /\d/;
|
元字符
代表特殊含义的元字符
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
| \d : 0-9之间的任意一个数字 \d只占一个位置
\w : 数字，字母 ，下划线 0-9 a-z A-Z _
\s : 空格或者空白等
\D : 除了\d
\W : 除了\w
\S : 除了\s
. : 除了\n之外的任意一个字符
\ : 转义字符
| : 或者
() : 分组
\n : 匹配换行符
\b : 匹配边界 字符串的开头和结尾 空格的两边都是边界 => 不占用字符串位数
^ : 限定开始位置 => 本身不占位置
$ : 限定结束位置 => 本身不占位置
[a-z] : 任意字母 []中的表示任意一个都可以
[^a-z] : 非字母 []中^代表除了
[abc] : abc三个字母中的任何一个 [^abc]除了这三个字母中的任何一个字符
|
代表次数的量词元字符
1
2
3
4
5
6
| * : 0到多个
+ : 1到多个
? : 0次或1次 可有可无
{n} : 正好n次；
{n,} : n到多次
{n,m} : n次到m次
|
量词出现在元字符后面 如\d+，限定出现在前面的元字符的次数
1
2
3
4
5
6
7
8
9
| var str = '1223334444';
var reg = /\d{2}/g;
var res = str.match(reg);
console.log(res)
var str =' 我是空格君 ';
var reg = /^\s+|\s+$/g;
var res = str.replace(reg,'');
console.log('('+res+')')
|
正则运算符的优先级
1.正则表达式从左到右进行计算，并遵循优先级顺序，这与算术表达式非常类似。
2.相同优先级的会从左到右进行运算，不同优先级的运算先高后低。
1
2
3
4
5
6
7
8
9
10
11
| 下面是常见的运算符的优先级排列
依次从最高到最低说明各种正则表达式运算符的优先级顺序：
\ : 转义符
(), (?:), (?=), [] => 圆括号和方括号
*, +, ?, {n}, {n,}, {n,m} => 量词限定符
^, $, \任何元字符、任何字符
| => 替换，"或"操作
字符具有高于替换运算符的优先级，一般用 | 的时候，为了提高 | 的优先级，我们常用()来提高优先级
如： 匹配 food或者foot的时候 reg = /foo(t|d)/ 这样来匹配
|
正则的特性
贪婪性:所谓的贪婪性就是正则在捕获时，每一次会尽可能多的去捕获符合条件的内容。
如果我们想尽可能的少的去捕获符合条件的字符串的话，可以在量词元字符后加?
懒惰性:懒惰性则是正则在成功捕获一次后不管后边的字符串有没有符合条件的都不再捕获。
如果想捕获目标中所有符合条件的字符串的话，我们可以用标识符g来标明是全局捕获。
1
2
3
4
5
6
7
8
9
| var str = '123aaa456';
var reg = /\d+/;
var res = str.match(reg)
console.log(res)
reg = /\d+?/g;
res = str.match(reg)
console.log(res)
|
和正则相关的一些方法
这里我们只介绍test、exec、match和replace这四个方法:
reg.test(str) 用来验证字符串是否符合正则 符合返回true 否则返回false
1
2
3
| var str = 'abc';
var reg = /\w+/;
console.log(reg.test(str));
|
reg.exec() 用来捕获符合规则的字符串
1
2
3
4
5
6
7
8
9
10
11
12
| var str = 'abc123cba456aaa789';
var reg = /\d+/;
console.log(reg.exec(str))
console.log(reg.lastIndex)
reg.exec捕获的数组中
0:"123" 表示我们捕获到的字符串
index:3 表示捕获开始位置的索引
input 表示原有的字符串
|
当我们用exec进行捕获时，如果正则没有加’g’标识符，则exec捕获的每次都是同一个，当正则中有’g’标识符时 捕获的结果就不一样了,我们还是来看刚刚的例子
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
| var str = 'abc123cba456aaa789';
var reg = /\d+/g;
console.log(reg.lastIndex)
console.log(reg.exec(str))
console.log(reg.lastIndex)
console.log(reg.exec(str))
console.log(reg.lastIndex)
console.log(reg.exec(str))
console.log(reg.lastIndex)
console.log(reg.exec(str))
console.log(reg.lastIndex)
每次调用exec方法时,捕获到的字符串都不相同
lastIndex ：这个属性记录的就是下一次捕获从哪个索引开始。
当未开始捕获时，这个值为0。
如果当前次捕获结果为null。那么lastIndex的值会被修改为0.下次从头开始捕获。
而且这个lastIndex属性还支持人为赋值。
|
exec的捕获还受分组()的影响
1
2
3
4
5
| var str = '2017-01-05';
var reg = /-(\d+)/g
"-01" : 正则捕获到的内容
"01" : 捕获到的字符串中的小分组中的内容
|
str.match(reg) 如果匹配成功，就返回匹配成功的数组，如果匹配不成功，就返回null
1
2
3
4
5
6
7
|
var str = 'abc123cba456aaa789';
var reg = /\d+/;
console.log(reg.exec(str));
console.log(str.match(reg));
|
上边两个方法console的结果有什么不同呢？二个字符串是一样滴。
当我们进行全局匹配时，二者的不同就会显现出来了.
1
2
3
4
5
6
| var str = 'abc123cba456aaa789';
var reg = /\d+/g;
console.log(reg.exec(str));
console.log(str.match(reg));
|
str.replace() 这个方法大家肯定不陌生，现在我们要说的就是和这个方法和正则相关的东西了。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
| 正则去匹配字符串，匹配成功的字符去替换成新的字符串
写法：str.replace(reg,newStr);
var str = 'a111bc222de';
var res = str.replace(/\d/g,'Q')
console.log(res)
replace的第二个参数也可以是一个函数
str.replace(reg,fn);
var str = '2017-01-06';
str = str.replace(/-\d+/g,function(){
console.log(arguments)
})
控制台打印结果：
["-01", 4, "2017-01-06"]
["-06", 7, "2017-01-06"]
"2017undefinedundefined"
从打印结果我们发现每一次输出的值似乎跟exec捕获时很相似，既然与exec似乎很相似，那么似乎也可以打印出小分组中的内容喽
var str = '2017-01-06';
str = str.replace(/-(\d+)/g,function(){
console.log(arguments)
})
["-01", "01", 4, "2017-01-06"]
["-06", "06", 7, "2017-01-06"]
"2017undefinedundefined"
从结果看来我们的猜测没问题。
此外，我们需要注意的是，如果我们需要替换replace中正则找到的字符串，函数中需要一个返回值去替换正则捕获的内容。
|
通过replace方法获取url中的参数的方法
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
| (function(pro){
function queryString(){
var obj = {},
reg = /([^?&#+]+)=([^?&#+]+)/g;
this.replace(reg,function($0,$1,$2){
obj[$1] = $2;
})
return obj;
}
pro.queryString = queryString;
}(String.prototype));
|
零宽断言
用于查找在某些内容(但并不包括这些内容)之前或之后的东西，如\b,^,$那样用于指定一个位置，这个位置应该满足一定的条件(即断言)，因此它们也被称为零宽断言。
在使用正则表达式时，捕获的内容前后必须是特定的内容，而我们又不想捕获这些特定内容的时候，零宽断言就可以派上用场了。
零宽度正预测先行断言 (?=exp)
零宽度负预测先行断言 (?!exp)
零宽度正回顾后发断言 (?<=exp)
零宽度负回顾后发断言 (?<!exp)
这四胞胎看着名字好长，给人一种好复杂好难的感觉，我们还是挨个来看看它们究竟是干什么的吧。
(?=exp) 这个简单理解就是说字符出现的位置的右边必须匹配到exp这个表达式。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
| var str = "i'm singing and dancing";
var reg = /\b(\w+(?=ing\b))/g
var res = str.match(reg);
console.log(res)
注意一点，这里说到的是位置，不是字符。
var str = 'abc';
var reg = /a(?=b)c/;
console.log(res.test(str));
reg中a(?=b)匹配字符串'abc' 字符串a的右边是b这个匹配没问题,接下来reg中a(?=b)后边的c匹配字符串时是从字符串'abc'中a的后边b的前边的这个位置开始匹配的，
这个相当于/ac/匹配'abc',显然结果是false了
|
(?!exp) 这个就是说字符出现的位置的右边不能是exp这个表达式。
1
2
3
| var str = 'nodejs';
var reg = /node(?!js)/;
console.log(reg.test(str))
|
(?<=exp) 这个就是说字符出现的位置的前边是exp这个表达式。
1
2
3
| var str = '￥998$888';
var reg = /(?<=\$)\d+/;
console.log(reg.exec(str))
|
(?<!exp) 这个就是说字符出现的位置的前边不能是exp这个表达式。
1
2
3
| var str = '￥998$888';
var reg = /(?<!\$)\d+/;
console.log(reg.exec(str))
|