前端JavaScript学习笔记之正则表达式

1、什么是正则表达式

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

2、正则表达式的创建

字面量(直接量)

在一对反斜线中写正则表达式的内容，正则表达式里面不需要加引号，不管是数字型还是字符型。

var reg = /正则表达式/修饰符;
var reg = /hello/g;

构造函数

//构造正则表达式的实例，如new RexExp('abc')
//内部传入的参数为字符串/字符串的变量
var reg =new RegExp("正则表达式","修饰符")
var reg =new RegExp("hello","g");

3、字符类型

普通字符

字母、数字、下划线、汉子、没有特殊符号含义的符号（,;[email protected]等）

特殊字符

:将特殊字符转义成普通字符

模式修饰符

i:匹配时忽略大小写

m：多行匹配

g：全局匹配

4、正则表达式实例方法

exec

用来匹配字符串中符合正则表达式的字符串

如果匹配到，返回的是一个数组

[匹配的内容，index：在str中匹配的起始位置，input：参数字符串，groups：undefined]

否则返回null

var str = 'hello world hello';
var reg1 = /hello/;
var reg2 = /hello/g;
var reg3 = /exe/g;
console.log(reg1.exec(str)); //[ 'hello', index: 0, input: 'hello world hello', groups: undefined ]
console.log(reg2.exec(str)); //[ 'hello', index: 0, input: 'hello world hello', groups: undefined ]
console.log(reg3.exec(str)); // null

test

用于测试待检测的资费串中是否有可以匹配到的正则表达式的字符串，如果有就返回true，否则返回false

var str = 'hello world';
var reg1 = /world/;
var reg2 = /Regex/;
console.log(reg1.test(str)); //返回true
console.log(reg2.test(str)); //返回false

注意：

​ 1、如果正则表达式中有修饰符“g”时，在实例reg中会维护lastIndex属性，记录下一次开始的位置，当第二次执行exec和test时，会从lastIndex开始检索。

​ 2、如果正则表达式中没有修饰符“g”时，就不会维护lastIndex属性，每次执行都会从开始位置检索。

5、正则表达式实例属性

lastIndex

当没有设置全局匹配时，该属性值始终为0

设置了全局匹配时，每次执行一次exec/test来匹配，lastIndex就会移到匹配到字符串的下一个位置，当指向的位置后没有可以再次匹配的字符串时，下一次执行exec返回null，test执行返回false，然后lastIndex归零，从字符串的开头重新匹配一轮。

ignoreCase、global、multiline

判断正则表达式中是否有忽略大小写、全局匹配、多行模式匹配三个修饰符

source

返回字面量形式的正则表达式（类似于toString）

var reg1 = /hello/igm;
console.log(reg1.source); //hello

6、正则表达式语法

直接量字符

正则表达式中的所有字母和数字都是按照字面含义进行匹配的，Javascript正则表达式语法也支持非字母的字符匹配，这些字符需要通过反斜线\作为前缀进行转义。

字符	匹配
字母和数字字符	自身
\o	Null字符
\t	制表符
\n	换行符
\v	垂直制表符
\f	换页符
\r	回车符

字符集合

一个字符集合，也叫字符组。匹配集合中的任意一个字符，可以使用连字符“-”指定一个范围。

方括号用于查找某个范围内的字符：

[abc] 查找方括号之间的任何字符（只要包含有a或者包含b或者c）

[0-9] 查找任何从0到9的数字

[^xyz] 一个反义或补充字符集，也叫反义字符集。她匹配任意不在方括号内的字符。

边界符

^ 匹配输入开始。表示匹配行首的文本。如果多行标志被设为true，该字符也会匹配一个断行符后的开始处。

$ 匹配输入结尾。表示匹配行尾的文本。如果多行标志被设为true，该字符也会匹配一个断行符的前的结尾处。

如果^和$在一起，表示必须是精确匹配。

var rg = /abc/; 
// /abc/ 只要包含有abc这个字符串返回的都是true
console.log(rg.test('abc'));  //true
console.log(rg.test('abcd')); //true
console.log(rg.test('aabcd'));//true
console.log('---------------------------');
// 必须是以abc开头的字符串才会满足
var reg = /^abc/;
console.log(reg.test('abc')); // true
console.log(reg.test('abcd')); // true
console.log(reg.test('aabcd')); // false
console.log('---------------------------');
// 必须是以abc结尾的字符串才会满足
var reg = /abc$/;
console.log(reg.test('abc')); // true
console.log(reg.test('qweabc')); // true
console.log(reg.test('aabcd')); // false
console.log('---------------------------');
var reg1 = /^abc$/; // 精确匹配 要求必须是 abc字符串才符合规范
console.log(reg1.test('abc')); // true
console.log(reg1.test('abcd')); // false
console.log(reg1.test('aabcd')); // false
console.log(reg1.test('abcabc')); // false

\b 匹配一个零宽单词边界，表示一个单词（而非字符）边界，也就是单词和空格之间的位置，或者字符与字符串开头或者结尾之间的位置。

\B 匹配一个零宽非单词边界，与“\b”相反

字符类

将直接量字符单独放在方括号内组成了字符类，一个字符类可以匹配它所包含的任意字符。

字符类	含义
.	匹配除换行符\n和回车符之外的任何单个字符，等效于**[^\n\r]**
\d	匹配一个数字字符，等效于[0-9]
\D	[^0-9]
\w	匹配包括下划线的任何单个字符，包括AZ，az，0~9和下划线**""**，等效于 [a-zA-Z0-9]
\W	[^a-zA-Z0-9_]
\s	匹配任何Unicode空白字符，包括空格、制表符、换页符等，等效于[\f\t\n\r]
\S	[^\f\t\n\r]

7、数量词

字符	含义
*	>=0次
+	≥1 次
？	0或1次
{n}	n 次
{n,}	≥n 次
{n,m}	n到m 次

X*匹配前面模式x->0或多次

// * 允许出现0次或多次
var reg = new RegExp(/^a*$/);
console.log(reg.test("a")); // true
console.log(reg.test("")); // true

X+匹配前面模式x->1次或多次

// + 允许出现1次或多次
var reg2 = new RegExp(/^a+$/);
console.log(reg2.test("a")); // true
console.log(reg2.test("")); // false

X？匹配前面模式x->0次或1次

// ? 只允许a出现1次或0次
var reg3 = new RegExp(/^a?$/);
console.log(reg3.test("a")); // true
console.log(reg3.test("")); // true
console.log(reg3.test("aaa")); // false

X{n} n为非负整数，前面模式x重复出现n次时匹配

// {3} 允许重复3次
var reg4 = new RegExp(/^a{3}$/);
console.log(reg4.test("a")); // false
console.log(reg4.test("")); // false
console.log(reg4.test("aaa")); // true
console.log(reg4.test("aaaa")); // false

X{n,} n为非负整数，前面模式x重复出现至少n次时匹配

// {3,} 允许重复出现3次或3次以上多次
var reg5 = new RegExp(/^a{3,}$/);
console.log(reg5.test("a")); // false
console.log(reg5.test("")); // false
console.log(reg5.test("aaa")); // true
console.log(reg5.test("aaaa")); // true

X{n,m} n和m为非负整数，前面模式x重复出现至少n次，至多m次时匹配

// {3,6} 允许重复出现3次-6次之间，也就是>=3且<=6
var reg6 = new RegExp(/^a{3,6}$/);
console.log(reg6.test("a")); // false
console.log(reg6.test("aaaa")); // true
console.log(reg6.test("aaaaaa")); // true
console.log(reg6.test("aaaaaaa")); // false

8、String对正则表达式的支持

search

查找字符串是否有匹配正则字符串，有则返回字符串第一次出现的位置，无则返回null。

正则表达式无论是否有全局匹配都不会影响返回结果

var str = 'hello world hello';
var reg = /hello/;
var reg2 = /hello/g;
console.log(str.search(reg)); //返回 0
console.log(str.search(reg2));//返回 0

match

匹配字符串中符合正则表达式的字符串，并返回该字符的一个数组，其中包括字符串内容、位置。

如果正则表达式设置了全局匹配，则一次性返回所有符合正则表达式的字符串数组。

var str = 'hello world hello';
var reg1 = /hello/;
var reg2 = /hello/g;
// 匹配字符串中符合正则表达式的字符串，并返回该字符串的一个数组，其中包括字符串内容、位置
// [ 'hello', index: 0, input: 'hello world hello', groups: undefined ]
console.log(str.match(reg1));
// 如果正则设置全局匹配，则一次性返回所有符合正则表达式的字符串数组
// [ 'hello', 'hello' ]
console.log(str.match(reg2));

split

// 以某种形式分割字符串 split()
var str = "zhangsan123lisi456wangwu";
// 当数字出现一次或多次时
var reg = /\d+/;
var result = str.split(reg);
console.log(result); // [ 'zhagsan', 'lisi', 'wangwu' ]

replace

// 满足正则表达式条件的内容将被替换
var str = 'javascript'
// 如果开启全局模式 则替换所有满足条件的字符
var reg = /javascript/;
// replace(正则表达式, 要替换的内容)
var result = str.replace(reg, 'java');
console.log(result); //java
console.log(str); //javascript