Js 正则表达式进阶笔记

正则入门笔记学习

三、正则表达式进阶

前言了解 - JavaScript match() 方法

• 定义和用法

match() 方法可在字符串内检索指定的值，或找到一个或多个正则表达式的匹配。

注意： match() 方法将检索字符串 String Object，以找到一个或多个与 regexp 匹配的文本。这个方法的行为在很大程度上有赖于 regexp 是否具有标志 g。如果 regexp 没有标志 g，那么 match() 方法就只能在 stringObject 中执行一次匹配。如果没有找到任何匹配的文本， match() 将返回 null。否则，它将返回一个数组，其中存放了与它找到的匹配文本有关的信息。

• 语法

string.match(regexp)

前言了解 - JavaScript exec() 方法

• 定义和用法

exec() 方法用于检索字符串中的正则表达式的匹配。

如果字符串中有匹配的值返回该匹配值，否则返回 null。

• 语法

RegExpObject.exec(string)

3.1 分组 - 分组允许你把一系列的标记一起处理

一、 (ABC) 捕获分组 - 把多个标记分在同一组并创建一个捕获分组，用来创建子串或引用。

var reg = /(hh)/g;

console.log(reg.test('hhdasd hh dasdhhasd hh')); // 输出 true
console.log(reg.test('hdsadas')); // 输出 false

分组有一个非常重要的功能——捕获数据。所以()被称为捕获分组，用来捕获数据，当我们想要从匹配好的数据中提取关键数据的时候可以使用分组。

var reg = /(hh)/g;

console.log('hhdasd hh dasdhhasd hh'.match(reg)); //输出 ['hh','hh','hh','hh']

• 提取出生日期中的年月日，例2000-01-01 提取 2000 01 01

var regs = /(\d{4})[\-\/](\d{1,2})[\/\-](\d{1,2})/g;

console.log(regs.exec('2000-01-01')); // 输出 ['2000-01-01', '2000', '01', '01', index: 0, input: '2000-01-01', groups: undefined]
console.log(RegExp.$1); // 输出 2000
console.log(RegExp.$2); // 输出 01
console.log(RegExp.$3); // 输出 01

补充：

$N : $1-$9存放着正则表达式中最近的9个正则表达式的匹配结果，这些结果按照子匹配的出现顺序依次排列。

• 提取区号后的电话号码，例0731-75855、86-138888888、tel:1384466545……

let phones = ['0731-75855', '86-138888888', 'tel:1384466545'];
phones.forEach((o) => {
	console.log(/\w+[\-:](\d+)/g.exec(o)[1]); // 依次输出 75855 138888888 1384466545
});

• 提取HTML标签中值，例<p>hello world!</p> 提取 hello world!

console.log(/<\w+>(.*)<\/\w+>/g.exec('<p>hello world!</p>')[1]); // 输出hello world!

补充：

考虑一种情况，所提取标签不符合规范，如<p></span> ,那么如何确保提取到的标签是符合规范的呢？

1. 分组的回溯引用，使用\N可以引用编号为N的分组
   • 这里的\1 就是表示第一个分组(\w+)

console.log(/<(\w+)>(.*)<\/\1>/g.exec('<p>hello world!</span>'));// 输出 null

二、在不创建捕获分组的情况下，把数个标记组在一起

(?:表达式)，从而不捕获数据，还能使用分组的功能

console.log('hahaha haa hah!'.match(/(?:ha)+/g)); // 输出 ['hahaha', 'ha', 'ha']

先行断言从左往右看，后行断言从右往左看

3.2 先行断言

一、正向先行断言 - 匹配主表达式后面的组而不将其包含在结果中。

(?=表达式)，指在某个位置向右看，表示所在位置右侧必须能匹配表达式

console.log('1px 2rpx 3em 4rem 5px 6vh 7pt'.match(/\d(?=px)/g)); // 输出 ['1', '5']

• 使用正向先行断言进行密码强度验证，要求 至少大小写字母各一，且不少于8位字符

console.log(/(?=.*?[a-z])(?=.*?[A-Z]).{8,}/g.test('123456aA')); // 输出 true

console.log(/(?=.*?[a-z])(?=.*?[A-Z]).{8,}/g.test('12356aA')); // 输出 false，少于8位
console.log(/(?=.*?[a-z])(?=.*?[A-Z]).{8,}/g.test('123456aa')); // 输出 false，缺少大写
console.log(/(?=.*?[a-z])(?=.*?[A-Z]).{8,}/g.test('123456AA')); // 输出 false，缺失小写

二、反向先行断言 - 指定主表达式后无法匹配的组（如果匹配，则结果将被丢弃）

(?!表达式)的作用是保证右边不能出现某字符。

console.log('hh+ dshh+ hh+das '.match(/hh(?!\+)/g)); // 输出 null，因其hh右边都出现了+，这里\+为转义后+字符，并非量词 + === {1, }

console.log(/hh(?!\+)/g.test('hh+ dshh+ hh+das')); // 输出 false
console.log(/hh(?!\+)/g.test('hhhhhdasdga')); // 输出 true，因其未出现+

• 匹配不是163邮箱的数据

console.log(/\w+@(?!163)\w(?:\.\w+)+$/g.test('123@qq.com')); // 输出 true
console.log(/\w+@(?!163)\w(?:\.\w+)+$/g.test('1sad23@qq.com.cn')); // 输出 true

console.log(/\w+@(?!163)\w(?:\.\w+)+$/g.test('1sad23@163.com.cn')); // 输出 false

3.3 后行断言

一、正向后行断言 - 匹配主表达式之前的组，而不将其包含在结果中

(?<=表达式)，指在某个位置向左看，表示所在位置左侧必须能匹配表达式

console.log(/(?<=张).+/g.test('张三')); // 输出 true
console.log(/(?<=张).+/g.test('李四')); // 输出 false

二、 反向后行断言 - 指定在主表达式之前无法匹配的组（如果匹配，则结果将被丢弃）

(?<!表达式)，指在某个位置向左看，表示所在位置左侧不能匹配表达式

• 匹配 # 符号中的数据

console.log(/(?<!#)#([^$]+)#(?!#)/g.exec('#132146asdas#')[1]); // 输出 132146asdas
console.log(/(?<!#)#([^$]+)#(?!#)/g.exec('213#132146asdas#21344asd')[1]); // 输出 132146asdas

console.log(/(?<!#)#([^$]+)#(?!#)/g.exec('213132146asdas#21344asd')); // 输出 null

四. 练习网站推荐

• 正则练习网址： https://www.codejiaonang.com/
• 正则在线测试网站： https://regexr-cn.com/

仅为学习所做笔记，如果不足或错误之处，请指出