正则表达式系列（贪婪和非贪婪模式)

前言

正则表达式的用法可以在正则表达式教程中查阅，此篇文章主要对一些重点进行梳理

一. 匹配

1. 全局匹配

const str = '1223333333';

const rg = /\d/g;

const res = str.match(rg);

console.log(res); // ['1', '2', '2', '3''3', '3', '3', '3','3', '3']

1. /g： 该修饰符表示全局匹配，当匹配到第一个符合正则规则的字符串之后，会一直匹配下去，直到无符合规则的字符串为止，这也是我们看到数组中有多项的原因。
2. \d: 无任何量词，正则规则\d 表示匹配一个数字字符，所以返回数组的每项只会返回一个字符串。

2. 量词匹配

 我们实际需求上每次匹配的字符串可能不只有一个，这时我们就可以添加上量词了

const str = '12233aaaa33333';

const rg = /\d+/g;

const res = str.match(rg);

console.log(res); //[ '12233', '33333' ]

所以匹配的过程可以分为两步：
(1). 匹配的范围;
(2). 匹配得到的每项的返回长度

3. 全局匹配和量词匹配的区别

1. 量词匹配：以整体根据量词规则进行匹配，且仅匹配一次；

2. 全局匹配：会匹配多次，第一次会以整体进行匹配，第一次如果整体都符合，那么只匹配一次，如果第一次匹配，符合项只是整体的一部分，那么会再次匹配剩余的内容，直到所有内容都匹配完。

   代码示例对比

const str = '1223333333';
const str2 = '1223aaaa333333';

const rg = /\d/g;
const rg1 = /\d+/;
const rg2 = /\d+/g;
const rg3 = /\d*/g;

const res = str.match(rg);
const res1 = str.match(rg1);
const res2 = str.match(rg2);
const res3 = str2.match(rg2);
const res4 = str2.match(rg3);

console.log(res, 'res');
// [
//   '1', '2', '2', '3',
//   '3', '3', '3', '3',
//   '3', '3'
// ]
console.log(res1, 'res1');
// [ '1223333333', index: 0, input: '1223333333', groups: undefined ]
console.log(res2, 'res2');
// [ '1223333333' ]
console.log(res3, 'res3');
// [ '1223', '333333' ]
console.log(res4, 'res4');
// [ '1223', '', '', '', '', '333333', '' ]

二. 贪婪匹配和非贪婪匹配

1. 贪婪匹配

一般趋向于最大长度匹配，总是尝试匹配尽可能多的字符

const str = '12233aaaa33333';

const rg = /\d*/g;

const res = str.match(rg);

console.log(res); // [ '12233', '', '', '', '', '33333', '' ]

*为匹配0到任意多个，所以尽可能匹配到最大长度字符串，一直到a不符合条件为止。
由于0个也符合，但是aaaa不符合正则规则，所以返回了’ ’

2. 非贪婪匹配

总是尝试匹配尽可能少的字符
正则表达式默认是贪婪模式；在量词后面直接加上一个问号？就是非贪婪模式。

// 匹配
const str = 'a12233aaaa33333';

const rg = /\d+/g; // 默认贪婪模式
const tempRg = /\d+?/g; // 非贪婪模式

const res = str.match(rg);

const tempRes = str.match(tempRg);

console.log(res); // [ '12233', '', '', '', '', '33333', '' ]
console.log(tempRes); // ['1', '2', '2', '3','3', '3', '3', '3', '3', '3']