js中的正则

1. 工具

2. RegExp对象

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

// 字面量
var reg = /\bis\b/g;
// 构造函数
var reg = new RegExp('\\bis\\b','g');

g: global全文搜索，默认只会找一个。
i: ignoreCase 忽略大小写，默认大小写敏感。
m: multipe 多行。

3. 元字符

14个特殊符号；使用原义需转义。

* + ？ $ ^ . | \ ( ) { } [ ]

序号	符号	说明
1	*	任意（零，一，多）
2	+	一个或多个
3	?	零个或一个
4	$	表达式结尾
5	^	方括号里表示取反；表达式开始
6	.	任意字符
7	\|	或
8	()	分组
9	{}	量词
10	[]	类词

序号	字符	说明
1	t	水平制表符 tab
2	v	垂直制表符 vertical tab
3	n	换行符 line feed
4	r	回车符 return
5	0	空字符 null
6	f	换页符 form feed
7	cX	ctrl+X

4. 字符类

4.1 一般情况下正则表达式的字符和字符串的字符一一对应

ab\t

对应

abtab

4.2 给字符归类

[abc]指a,b,c之一

4.3 字符类取反

[^abc]指除了a,b,c之外的

4.4 范围类

[a-zA-Z0-9]

5. 预定义类和边界

序号	字符	等价类	说明
1	.	¹	除了回车符和换行符之外的所有字符
2	d	[0-9]	数字
3	D	²	非数字
4	s	[tnrfv]	space 空字符
5	S	³	非空字符
6	w	[a-zA-Z0-9_]	word 单词数字大小写字母下划线
7	W	⁴	非单词

序号	字符	含义
1	^	以XXX开始
2	$	以XXX结尾
3	b	单词边界
4	B	非单词边界

6. 量词

序号	字符	含义
1	*	任意（零，一，多）
2	+	一个或多个
3	?	零个或一个
4	{m}	m次
5	{m,n}	m-n次
6	{m,}	至少m次

7. 贪婪模式

str='12345678'.replace(/\d{3,6}/g,'$');

console.log(str);

结果：$78

默认贪婪模式，非贪婪模式是尽可能少的匹配。做法是在量词后面加?

str='12345678'.replace(/\d{3,6}?/g,'$');

console.log(str);

结果：$$78

8. 分组

byron{3}匹配n三次不是byron三次。解决就是分组。

(byron){3}

和|配合使用

byr(on|en)lich{3}

反向引用捕获组: $1 $2 ...

str='2016-12-25'.replace(/(\d{4})-(\d{2})-(\d{2})/g,'$2/$3/$1');

结果：12/25/2016

忽略分组，在分组内加?:

(?:Byron){3}

例子：

str='byronbyronbyron'.replace(/(byron){3}/,'@$1')
"@byron"
str='byronbyronbyron'.replace(/(?:byron){3}/,'@$1')
"@$1"

9. 前瞻(可加断言)

正则表达式从文本头部向尾部开始解析，文本尾部方向，称为“前”。

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

javaScript不支持后顾。

符合和不符合特定断言称为肯定/正向匹配和否定/负向匹配。

名称	正则	例子
正向前瞻	exp(?=asset)	/w(?=d)
负向前瞻	exp(?!asset)	w(?!d)
正向后顾	exp(?<=asset)	略
负向后顾	exp(?<!asset)	略

例子：

'a2*a3'.replace(/\w(?=\d)/g, '@')
"@2*@3"
'a2*a3'.replace(/\w(?!\d)/g, '@')
"a@*a@"

10. js对象属性

利用console.dir打印reg

var reg = /\w/;
console.dir(reg);
{
    flags: "",
    global: false, 
    ignoreCase: false,
    lastIndex: 0,
    multiline: false,
    source: "\w",
    sticky: false,
    unicode: false,
    __proto__: Object
}

11. RegExp的test和exec函数

11.1 test

text函数用于测试字符串参数中是否存在匹配正则表达式模式的字符串；如果存在则返回true，否则返回false;

var reg=/\w/;
reg.test('a');true
reg.test('a');true

var reg=/\w/g;
reg.test('a');true
reg.test('a');false

出现上面那种情况的原因是lastIndex属性；global为false时，该属性无效；global为true时，该属性会记录上一次匹配完后的位置，并且下一次查询会从该未知开始。

var reg=/\w/g;
console.log(reg.test('a'),reg.lastIndex); true 1
console.log(reg.test('a'),reg.lastIndex); false 0

所以，global为true或false对正则的匹配是两种行为。

11.2 exec

exec：使用正则表达式模式对字符串执行搜索，并将更新全局RegExp对象的属性以反映匹配结果；如果没有匹配的文本则返回null,否则返回一个结果数组。

var reg=/\w\d/; 
reg.exec('a1b2c3d4e5f6ggg');
reg.exec('a1b2c3d4e5f6ggg');
两次都返回：["a1", index: 0, input: "a1b2c3d4e5f6ggg"]
数组第一个是匹配到的结果；global为false时，只会匹配一个。
数组第二个是匹配到的结果的位置，是个对象{index:0}；
数组第三个是匹配的字符串

global为true时，两次返回的结果不一样。

var reg=/\w\d/g; 
reg.exec('a1b2c3d4e5f6ggg');
reg.exec('a1b2c3d4e5f6ggg');
返回：
["a1", index: 0, input: "a1b2c3d4e5f6ggg"]
["b2", index: 2, input: "a1b2c3d4e5f6ggg"]

有分组时：

var reg=/(\w)\d/g; 
reg.exec('a1b2c3d4e5f6ggg');
reg.exec('a1b2c3d4e5f6ggg');
["a1", "a", index: 0, input: "a1b2c3d4e5f6ggg"]
["b2", "b", index: 2, input: "a1b2c3d4e5f6ggg"]
多了分组的数据。

一般是循环的写法：

var ts = 'a1b2c3d4e5f6ggg'
var reg=/(\w)\d/g; 
while(ret=reg.exec(ts)){
    console.log(ret.toString());
}

输出

a1,a
b2,b
c3,c
d4,d
e5,e
f6,f

12. 字符串的方法

12.1 str.search

string.search(str,replaceStr);
string.search(reg,replaceStr);

12.2 str.mathch

string.match(str,replaceStr);
string.match(reg,replaceStr);

12.3 str.replace

string.replace(str,replaceStr);
string.replace(reg,replaceStr);
string.replace(reg,function);

13. 例子

// 取扩展名
const str = "http://file.xxx.com/test/2017/09/19/34457aef4a9649e2af2f1d4e9c14d0d3.mp4";
const reg = new RegExp('^http:[/\\w.]*/(\\w*).mp4$');
const result = reg.exec(str);
console.log(result[1]);// 34457aef4a9649e2af2f1d4e9c14d0d3

// 替换source标签
const str = "aaa<source src='http://file.xxx.net/ueditor/jsp/upload/video/20170922/1506081788002070202.mp4' type='video/mp4'/>bbb";

const result = str.replace(/<source[\w\s=:'.\/0-9]+\/>/g,'');
console.log(result);// aaabbb

参考：慕课网js正则

rn ↩
0-9 ↩
tnrfv ↩
a-zA-Z0-9_ ↩