博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
正则的扩展
阅读量:6988 次
发布时间:2019-06-27

本文共 5985 字,大约阅读时间需要 19 分钟。

本文为学习笔记;

 <<<<转载请注明原文出处!

RegExp 构造函数

在 ES5 中,RegExp构造函数的参数有两种情况:

  • 参数是字符串,这时第二个参数表示正则表达式的修饰符(flag);

    var regex = new RegExp('xyz', 'i');// 等价于var regex = /xyz/i;
  • 参数是一个正则表示式,这时会返回一个原有正则表达式的拷贝。

    var regex = new RegExp(/xyz/i);// 等价于var regex = /xyz/i;

但是,ES5 不允许此时使用第二个参数添加修饰符,否则会报错。

var regex = new RegExp(/xyz/, 'i');// Uncaught TypeError: Cannot supply flags when constructing one RegExp from another

ES6 改变了这种行为。如果RegExp构造函数第一个参数是一个正则对象,那么可以使用第二个参数指定修饰符。而且,返回的正则表达式会忽略原有的正则表达式的修饰符,只使用新指定的修饰符。

new RegExp(/abc/ig, 'i').flags// "i"上面代码中,原有正则对象的修饰符是ig,它会被第二个参数i覆盖。

字符串的正则方法

字符串对象共有 4 个方法,可以使用正则表达式:match()replace()search()split()

ES6 将这 4 个方法,在语言内部全部调用RegExp的实例方法,从而做到所有与正则相关的方法,全都定义在RegExp对象上:

  • String.prototype.match 调用 RegExp.prototype[Symbol.match]
  • String.prototype.replace 调用 RegExp.prototype[Symbol.replace]
  • String.prototype.search 调用 RegExp.prototype[Symbol.search]
  • String.prototype.split 调用 RegExp.prototype[Symbol.split]

u 修饰符

ES6 对正则表达式添加了u修饰符,含义为“Unicode 模式”,用来正确处理大于\uFFFF的 Unicode 字符。也就是说,会正确处理四个字节的 UTF-16 编码。

一旦加上u修饰符号,就会修改下面这些正则表达式的行为:

  • 点字符
    点(.)字符在正则表达式中,含义是除了换行符以外的任意单个字符。对于码点大于0xFFFF的 Unicode 字符,点字符不能识别,必须加上u修饰符。
  • Unicode 字符表示法
    ES6 新增了使用大括号表示 Unicode 字符,这种表示法在正则表达式中必须加上u修饰符,才能识别当中的大括号,否则会被解读为量词。
  • 量词
    使用u修饰符后,所有量词都会正确识别码点大于0xFFFF的 Unicode 字符。
  • 预定义模式
    u修饰符也影响到预定义模式,能否正确识别码点大于0xFFFF的 Unicode 字符。
  • i 修饰符
    有些 Unicode 字符的编码不同,但是字型很相近,比如,\u004B\u212A都是大写的K

RegExp.prototype.unicode 属性

正则实例对象新增unicode属性,表示是否设置了u修饰符。

const r1 = /hello/;const r2 = /hello/u; r1.unicode // falser2.unicode // true

y 修饰符

除了u修饰符,ES6 还为正则表达式添加了y修饰符,叫做“粘连”(sticky)修饰符。

y修饰符的作用与g修饰符类似,也是全局匹配,后一次匹配都从上一次匹配成功的下一个位置开始。不同之处在于:g修饰符只要剩余位置中存在匹配就可,而y修饰符确保匹配必须从剩余的第一个位置开始,这也就是“粘连”的涵义。

实际上,y修饰符号隐含了头部匹配的标志^

y修饰符的设计本意,就是让头部匹配的标志^在全局匹配中都有效。

RegExp.prototype.sticky 属性

与y修饰符相匹配,ES6 的正则实例对象多了sticky属性,表示是否设置了y修饰符。

RegExp.prototype.flags 属性

ES6 为正则表达式新增了flags属性,会返回正则表达式的修饰符。

// ES5 的 source 属性// 返回正则表达式的正文/abc/ig.source// "abc"// ES6 的 flags 属性// 返回正则表达式的修饰符/abc/ig.flags// 'gi'

s 修饰符:dotAll 模式

正则表达式中,点(.)是一个特殊字符,代表任意的单个字符,但是有两个例外。一个是四个字节的 UTF-16 字符,这个可以用u修饰符解决;另一个是行终止符(line terminator character)。

所谓行终止符,就是该字符表示一行的终结。以下四个字符属于”行终止符“。

  • U+000A 换行符(\n
  • U+000D 回车符(\r
  • U+2028 行分隔符(line separator
  • U+2029 段分隔符(paragraph separator

ES2018 引入s修饰符,使得.可以匹配任意单个字符,这被称为dotAll模式,即点(dot)代表一切字符;所以,正则表达式还引入了一个dotAll属性,返回一个布尔值,表示该正则表达式是否处在dotAll模式。

/s修饰符和多行修饰符/m不冲突,两者一起使用的情况下,.匹配所有字符,而^$匹配每一行的行首和行尾。

后行断言

JavaScript 语言的正则表达式,只支持先行断言(lookahead)和先行否定断言(negative lookahead),不支持后行断言(lookbehind)和后行否定断言(negative lookbehind)。ES2018 引入后行断言,V8 引擎 4.9 版(Chrome 62)已经支持。

  • 先行断言指的是:x只有在y前面才匹配,必须写成/x(?=y)/。比如,只匹配百分号之前的数字,要写成/\d+(?=%)/先行否定断言指的是:x只有不在y前面才匹配,必须写成/x(?!y)/。比如,只匹配不在百分号之前的数字,要写成/\d+(?!%)/
  • 先行断言括号之中的部分((?=%)),是不计入返回结果的。
  • 后行断言正好与 先行断言 相反,x只有在y后面才匹配,必须写成/(?<=y)x/。比如,只匹配美元符号之后的数字,要写成/(?<=\$)\d+/后行否定断言则与先行否定断言相反,x只有不在y后面才匹配,必须写成/(?<!y)x/。比如,只匹配不在美元符号后面的数字,要写成/(?<!\$)\d+/
  • 后行断言的括号之中的部分也是不计入返回结果。

后行断言的实现,需要先匹配/(?<=y)x/x,然后再回到左边,匹配y的部分。这种“先右后左”的执行顺序,与所有其他正则操作相反,导致了一些不符合预期的行为:

  • 首先,后行断言的组匹配,与正常情况下结果是不一样的。
  • 其次,“后行断言”的反斜杠引用,也与通常的顺序相反,必须放在对应的那个括号之前。

Unicode 属性类

ES2018 引入了一种新的类的写法\p{...}\P{...},允许正则表达式匹配符合 Unicode 某种属性的所有字符。

Unicode 属性类要指定属性名和属性值。

对于某些属性,可以只写属性名,或者只写属性值。

\P{…}\p{…}的反向匹配,即匹配不满足条件的字符。

具名组匹配

正则表达式使用圆括号进行组匹配。

const RE_DATE = /(\d{4})-(\d{2})-(\d{2})/;

上面代码中,正则表达式里面有三组圆括号。使用exec方法,就可以将这三组匹配结果提取出来。

const RE_DATE = /(\d{4})-(\d{2})-(\d{2})/;const matchObj = RE_DATE.exec('1999-12-31');const year = matchObj[1]; // 1999const month = matchObj[2]; // 12const day = matchObj[3]; // 31

组匹配的一个问题是,每一组的匹配含义不容易看出来,而且只能用数字序号(比如matchObj[1])引用,要是组的顺序变了,引用的时候就必须修改序号。

ES2018 引入了具名组匹配(Named Capture Groups),允许为每一个组匹配指定一个名字,既便于阅读代码,又便于引用。

const RE_DATE = /(?
\d{4})-(?
\d{2})-(?
\d{2})/;const matchObj = RE_DATE.exec('1999-12-31');const year = matchObj.groups.year; // 1999const month = matchObj.groups.month; // 12const day = matchObj.groups.day; // 31

“具名组匹配”在圆括号内部,模式的头部添加“问号 + 尖括号 + 组名”(?<year>),然后就可以在exec方法返回结果的groups属性上引用该组名。同时,数字序号(matchObj[1])依然有效。

具名组匹配等于为每一组匹配加上了 ID,便于描述匹配的目的。如果组的顺序变了,也不用改变匹配后的处理代码。


解构赋值和替换

解构赋值

有了具名组匹配以后,可以使用解构赋值直接从匹配结果上为变量赋值。

let {groups: {one, two}} = /^(?
.*):(?
.*)$/u.exec('foo:bar');one // footwo // bar

字符串替换

let re = /(?
\d{4})-(?
\d{2})-(?
\d{2})/u;'2015-01-02'.replace(re, '$
/$
/$
')// '02/01/2015'

replace方法的第二个参数也可以是函数,该函数的参数序列如下:

'2015-01-02'.replace(re, (   matched, // 整个匹配结果 2015-01-02   capture1, // 第一个组匹配 2015   capture2, // 第二个组匹配 01   capture3, // 第三个组匹配 02   position, // 匹配开始的位置 0   S, // 原字符串 2015-01-02   groups // 具名组构成的一个对象 {year, month, day} ) => { let {day, month, year} = groups; return `${day}/${month}/${year}`;});

具名组匹配在原来的基础上,新增了最后一个函数参数:具名组构成的一个对象。函数内部可以直接对这个对象进行解构赋值。


引用

如果要在正则表达式内部引用某个“具名组匹配”,可以使用\k<组名>的写法。

String.prototype.matchAll

如果一个正则表达式在字符串里面有多个匹配,现在一般使用g修饰符或y修饰符,在循环里面逐一取出。

var regex = /t(e)(st(\d?))/g;var string = 'test1test2test3';var matches = [];var match;while (match = regex.exec(string)) {  matches.push(match);}matches// [//   ["test1", "e", "st1", "1", index: 0, input: "test1test2test3"],//   ["test2", "e", "st2", "2", index: 5, input: "test1test2test3"],//   ["test3", "e", "st3", "3", index: 10, input: "test1test2test3"]// ]

上面代码中,while循环取出每一轮的正则匹配,一共三轮。

目前有一个提案,增加了String.prototype.matchAll方法,可以一次性取出所有匹配。不过,它返回的是一个遍历器(Iterator),而不是数组。

const string = 'test1test2test3';// g 修饰符加不加都可以const regex = /t(e)(st(\d?))/g;for (const match of string.matchAll(regex)) {  console.log(match);}// ["test1", "e", "st1", "1", index: 0, input: "test1test2test3"]// ["test2", "e", "st2", "2", index: 5, input: "test1test2test3"]// ["test3", "e", "st3", "3", index: 10, input: "test1test2test3"]

上面代码中,由于string.matchAll(regex)返回的是遍历器,所以可以用for...of循环取出。相对于返回数组,返回遍历器的好处在于,如果匹配结果是一个很大的数组,那么遍历器比较节省资源。

遍历器转为数组是非常简单的,使用...运算符和Array.from方法就可以了。

// 转为数组方法一[...string.matchAll(regex)]// 转为数组方法二Array.from(string.matchAll(regex));

转载于:https://www.cnblogs.com/apimhnkj/p/10141542.html

你可能感兴趣的文章
lc686. Repeated String Match
查看>>
RHEL 7.1操作系统安装过程说明
查看>>
基于Python的性能自动化测试框架设计思路和实现
查看>>
Spark里几个重要的概念及架构
查看>>
dubbo-rpc基本功能
查看>>
7月国内电脑分辨率TOP10 :1366*768跌破13%
查看>>
CefSharp获取网页源码时卡住长时间没有返回结果
查看>>
刚入门Python的小伙伴,这是腾讯大牛工作中总结的爬虫经验!
查看>>
智能微型机器人可随周围环境“变身”
查看>>
Linux操作系统 MBR扇区故障了怎么办
查看>>
Java网络编程基础(一)
查看>>
在Mac版本下的IDEA中设置代码注释模版
查看>>
我的友情链接
查看>>
Ruby实现二分法查找
查看>>
OA系统报错
查看>>
JavaScript设计模式之一:面向对象的Javascript
查看>>
Web 前沿技术:展示一组极其绚丽的 CSS3 效果
查看>>
唐老师答疑
查看>>
第十二章 简单工厂模式(Simple Facotry)
查看>>
LeetCode - 70. 爬楼梯
查看>>