目录
JS的正则表达式之前有写过相关内容,但ES6+也提出了一些新的方法和规则,这篇文章算是承接之前的文章内容做一些补充吧,可能不是很全面,不了解之前文章可以点击这个链接:一文了解JS的正则表达式
分组命名捕获
分组命名捕获即具名组匹配,允许每一个组匹配指定的一个名字,便于阅读代码和引用,其使用方式为:问号 + 尖括号 + 组名 (例:?<num>),然后就可以在返回结果的 groups 属性上引用该组名,其作用为:具名组为每一组匹配加上 ID ,便于描述匹配的目的,即使组的属性变了也不用改变匹配后处理代码,如果具名组没有匹配,那么对应的 groups 对象属性会是 undefined。如下:
<script>
// 声明一个字符串
let str = '<a href="http://www.baidu.com">百度</a>'
// 提取 url 与 标签文本
const reg = /<a href="(.*)">(.*)<\/a>/
// 执行
const result = reg.exec(str)
console.log(result);
console.log(result[1]);
console.log(result[2]);
// 设置分组名
const reg1 = /<a href="(?<url>.*)">(?<test>.*)<\/a>/
const result1 = reg1.exec(str)
console.log(result1);
console.log(result1.groups.url);
console.log(result1.groups.test);
</script>
反向断言
反向断言前期是没有的,只有正向断言,2018年ES引入反向断言;两者之间的的使用方式一致,例如:正向断言 /\d+(?=%)/ 只匹配百分号前面的数字、反向断言 /(?<=%)\d+/ 只匹配百分号后面的数字;正向否定断言 /\d+(?!%)/ 只匹配不在百分号之前的数字、反向否定断言 /(?<!%)\d+/ 只匹配不在百分号后面的数字。简例如下:
<script>
// 声明字符串
let str = 'who123五五五444三三三'
// 正向断言
const reg = /\d+(?=三)/ //问号等于号表示数字后面刚好满足的汉字是“三”
const result = reg.exec(str)
console.log(result);//444
// 正向否定断言
const reg_1 = /\d+(?!三)/ //问号感叹号表示数字数字后面不满足的汉字是“三”
const result_1 = reg_1.exec(str)
console.log(result_1);//123
// 反向断言
const reg1 = /(?<=五)\d+/ //小于号表示前面,等于号表示满足,即数字前面刚好是汉字“五”
const result1 = reg1.exec(str)
console.log(result1);//444
// 反向否定断言
const reg1_1 = /(?<!五)\d+/ //小于号表示前面,感叹号表示不满足,即数字前面不是汉字“五”
const result1_1 = reg1_1.exec(str)
console.log(result1_1);//123
</script>
dotAll模式
在正则表达式中,点( . )是一个特殊的字符,能够匹配除换行符以外的任意单个字符;引入s修饰符,使得 . 可以匹配任意单个字符,这种被称为dotAll模式。通过返回一个布尔值来判断该正则表达式是否处于dotAll模式。
<script>
const reg = /aaa.bbb/s
console.log(reg.test('aaa\nbbb'));//true
</script>
y修饰符
y修饰符也叫做“粘连”修饰符,作用与g修饰符类似,也是全局匹配。不同之处在于进行多次匹配时,g修饰符只要在前次匹配后面找到存在匹配即可,而y修饰符必须确保在前次匹配后,从剩余的第一个位置开始。
<script>
var str = '123_12_1'
var reg1 = /\d+/g
var reg2 = /\d+/y
// 第一次匹配
console.log(reg1.exec(str));//123
console.log(reg2.exec(str));//123
// 第二次匹配
// 由于g修饰符没有位置要求,所以只要匹配后面符合的即可
console.log(reg1.exec(str));//12
// 由于y修饰符有位置要求,所以要从 123后面的下划线 _ 开始,所以返回null
console.log(reg2.exec(str));//null
</script>
ES6提供了正则实例对象 sticky 属性,表示是否设置了 y 修饰符。
<script>
var reg = /\d/y
console.log(reg.sticky);//true
</script>
当然 ES6也为表达式新增了 flags 属性,用来返回正则表达式的修饰符。之前的 ES5 中的 source 属性用来返回 正则表达式的正文。
<script>
var reg = /\d/y.source //返回表达式正文
var reg1 = /\d/y.flags //返回修饰符
console.log(reg); // \d
console.log(reg1); // y
</script>
matchAll()
matchAll()方法可以一次性取出所有匹配,不过它返回的是一个遍历器,而不是数组,因为是遍历器所以可以用 for…of 循环取出;如果遍历器转为数组可以通过使用扩展运算符或者Array.from()方法即可。
<script>
const string = 'test1test2test3';
const regex = /t(e)(st(\d?))/g;
for (const match of string.matchAll(regex)) {
console.log(match);
}
// 遍历器转换为数组
console.log(...string.matchAll(regex));
</script>
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
文章由极客之音整理,本文链接:https://www.bmabk.com/index.php/post/140049.html