正则的扩展

1. RegExp 构造函数

ES5RegExp 构造函数的两种用法:

  1. 第一个参数是字符串,第二个参数是正则表达式的修饰符
var regexp = new RegExp('xyz', 'g');
// 等价于
var regexp = /xyz/g;
  1. 只有一个参数,参数是一个正则表达式,修饰符包含在这个正则表达式中,不允许出现第二个参数,否则会报错。
var regexp = new RegExp(/xyz/g);
// 等价于
var regexp = /xyz/g;

// 下面这种情况会报错
var regexp = new (/xyz/g, 'i'); // ES5中当第一个参数是正则表达式时不允许出现第二个参数

ES6 解决了这个问题,而且第二个参数指定的修饰符会覆盖掉第一个参数中的修饰符。

var regexp =new RegExp(/xyz/ig, 'i');
regexp.flags // 'i'

注意:第二个参数中的修饰符是一个字符(字符串),要用引号引起来。以修饰符 i 为例,若是不用引号引起来,那 i 不就表示一个变量了吗?

2. 字符串的正则方法

字符串对象可以使用正则表达式的四个方法:

  1. match()
  2. replace()
  3. split()
  4. search()

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

String.prototype.match 调用 RegExp.prototype[symbol.match]

3. u 修饰符

ES6 对正则表达式新添加了 u 修饰符,用来处理码点大于 \uFFFF 的字符。记住 u 修饰符的作用就是以前不能处理码点大于 \uFFFF 的字符,现在可以了。

下面举例说明加上 u 修饰符后带来了哪些改变:

  1. 测试匹配结果发生变化
/^\uD842/u.test('\uD842\uDFB7'); // false
/^\uD842/.test('\uD842\uDFB7'); // true

'\uD842\uDFB7' 是一个四字节 UTF-16 编码,代表字符 '?',若不加 u 修饰符,那么会将其当作两个字 符,第一个字符为 '\uD842' 故会返回 true ,加上 u 修饰符之后就会将其识别为一个字符,不会和 \uD842 匹配,故会返回 false

  1. 点字符

    点字符(.) 在正则表达式中的含义是除换行符之外的任意单个字符。

    当码点大于 \uFFFF 时,点字符无法正确识别,当加上 u 修饰符时,点字符就可以识别了。

var s = '?';
/^.$/.test(s); // false
/^.$/u.test(s); // true
  1. Unicode 字符表示

    字符串的扩展(ES6)1. 字符的Unicode表示法一节中我们知道,ES6 新增了了使用大括号来表示 Unicode 字符的表示法,'\u{20BB7}' 表示 '?'

    但是在正则表达式中,要想使用大括号表示 Unicode 字符,必须加上 u 修饰符,否则会被解读为量词。

/\u{61}/.test('a'); // false,不加u修饰符,会被认为连续匹配61个u字符
/\u{61}/u.test('a'); // true
  1. 量词

    不使用 u 修饰符 使用 u 修饰符
    只能识别码点小于 \uFFFF 的字符 可以识别码点大于 \uFFFF 的字符
  2. i 修饰符

    有些 Unicode 字符的编码不同,但是字型是相近或相同的,比如, \u004B\u212A 都是大写的 'K'。字符有规范和不规范一说,不使用 u 修饰符就不能识别非规范的 Unicode 字符。

/[a-z]/i.test('\u212A'); // false
/[a-z]/iu.test('\u212A'); // true

​ 如果不加 u 修饰符就不能识别出非规范的 K 字符,出现遗漏等情况。

4. y 修饰符

y 修饰符的作用与 g 修饰符的作用类似,都是全局匹配,但是 g 修饰符只要在剩余位置下存在匹配就行,而 y 修饰符必须要从剩余的第一个位置开始匹配,也就是暗含头部匹配的条件。

y 修饰符又叫“粘连”修饰符

var s = "aaa_aa_a";
var r1 = /a+/g;
var r2 = /a+/y;

r1.exec(s); // ["aaa"], lastIndex=3
r2.exec(s); // ["aaa"], lastIndex=3

r1.exec(s); // ["aa"], 从"aaa_aa_a"中第4个位置"_"开始匹配,由于是g,故可以匹配到"aa".
r2.exec(s); // null, 从"aaa_aa_a"中第4个位置"_"开始匹配,由于是y暗含头部匹配,所以必须从开始的第一个  // 位置就要匹配上,但是开始匹配的第一个位置是"_",所以匹配不上。

5. sticky 属性

只读布尔值,表示是否设置了y修饰符

6. flags 属性

返回正则表达式的修饰符 /abc/ig.flags // 'gi'

7. s 修饰符:dotAll 模式

使 '.' 修饰符可以匹配任意一个字符

8. 后行断言

字符 含义
(?<=p)(提案) 后行断言,要求前面的字符要与p匹配,并且匹配的结果中不包含p,如 var result = /(?<=\$)\d+/.exec('$100*80'); // result=['100']
(?<!p) 后行否定断言,要求前面的字符不能与p匹配,并且匹配结果中不包含p,如 var result= /(?!\$)\d+/.exec('$100*80'); // result=['80']

9. 具名组匹配

字符 含义
(?<name>)(提案) 具名组 格式:“问号+尖括号+组名” 作用:为每一个组匹配指定一个名字 ,可以通过exec方法返回结果的groups属性上引用该组名 示例1let result = /(?<year>\d{4})-(?<month>\d{2})/.exec('2019-10'); // result=[‘2019-10’,‘2019’,10] result.groups={year:‘2019’, month:‘10’} 注意:如果要在正则表达式内部引用某个“具名组匹配”,可以使用 \k<组名> 的写法,同时数组引用也依然有效 示例2let result = /^(?<word>[a-z]+)!\k(word)!\1$/.test('abc!abc!abc') // true let result = /^(?<word>[a-z]+)!\k(word)!\1$/.test('abc!abc!ab') // false

ES6对正则的改进(简要总结)的更多相关文章

  1. ES6入门——正则的扩展

    1.RegExp构造函数 在ES5中,RegExp构造函数的参数有两种情况.第一种情况是参数是字符串,这时第二个参数表示正则表达式的修饰符:第二种情况是,参数是一个正则表示式,这时会返回一个原有正则表 ...

  2. ES6扩展——正则扩展(u、y修饰符)

    //下面三行代码效果一样 //全局匹配开头为a的 const regexp1 = /^a/g; const regexp2 = new RegExp('a','g'); const regexp3 = ...

  3. ES6(四) --- 正则 Number Math

    想学vue了  重启ES6的学习之路 在ES5 中正则的构造器  RegExp  不支持第二个参数 ES6 做了调整   第二个参数表示正则表达式的修饰符(flag) var regex = new ...

  4. es6的正则扩展笔记之修饰符

    es6对于正则表达式添加了 u 修饰符和 y 修饰符. u 修饰符:含义为“Unicode模式”,用来正确处理大于\uFFFF的Unicode字符.    该修饰符不光会正确处理正则表达式,还会正确处 ...

  5. ES6对数组的扩展(简要总结)

    文章目录 数组的扩展(ES6) 1. 扩展运算符 2. Array.from 3. Array.of() 4. copyWithin() 5. find() 和 findIndex() 6. fill ...

  6. 【es6】正则扩展

  7. 精读《正则 ES2018》

    1. 引言 本周精读的文章是 regexp-features-regular-expressions. 这篇文章介绍了 ES2018 正则支持的几个重要特性: Lookbehind assertion ...

  8. ES6(正则扩展)

    ES6中正则的扩展 正则新增特性 一.构造函数的变化 1.ES5中new一个正则对象方法 (一行中2个参数,二行中1个参数) (第一行中的第一个参数必须是字符串) 2.ES6中新增一种方法(构造函数) ...

  9. es6正则表达式

    es6中如果RegExp构造函数第一个参数是一个正则对象,那么可以使用第二个参数指定修饰符. 而且,返回的正则表达式会忽略原有的正则表达式的修饰符,只使用新指定的修饰符. new RegExp(/ab ...

随机推荐

  1. Openlayers ol.interaction.Select传值问题

    说明: 在使用ol.interaction.Select时,我定义的变量作用域作用不到其回调函数里,但我在select结果中,需要用到这些变量 解决方案: 虽想了个办法解决了,但不知道是不是合理:是否 ...

  2. wincap linux部署

    1.4.1 linux下安装Winpcap a) 下载Winpcap的源码:https://www.winpcap.org/devel.htm b) 上传源码包“WpcapSrc_4_1_3.zip” ...

  3. android 活动监听是否点击某个view

    前述(写给做过web前端的人) 在web H5,如果如果判断当前是否点击某个元素,一般会这样写. window.addEventListener("touchstart",func ...

  4. Elasticsearch系列---增量更新原理及优势

    概要 本篇主要介绍增量更新(partial update,也叫局部更新)的核心原理,介绍6.3.1版本的Elasticsearch脚本使用实例和增量更新的优势. 增量更新过程与原理 简单回顾 前文我们 ...

  5. 渗透测试初学者的靶场实战 1--墨者学院SQL注入—布尔盲注

    前言 大家好,我是一个渗透测试的爱好者和初学者,从事网络安全相关工作,由于爱好网上和朋友处找了好多关于渗透的视频.工具等资料,然后自己找了一个靶场,想把自己练习的体会和过程分享出来,希望能对其他渗透爱 ...

  6. 如何看一款app里面所包含的图片

    在开发制作App的过程中,有时候会想看看一些精美的App里面所设计的素材.这个时候就需要用到我给大家展现的方法了.下面就看看该如何操作能让一个App呈现出它原始的一面,这次我以Any.Do为例给大家演 ...

  7. MySQL的5种时间类型的比较

    日期时间类型 占用空间 日期格式 最小值 最大值 零值表示 DATETIME 8 bytes YYYY-MM-DD HH:MM:SS 1000-01-01 00:00:00 9999-12-31 23 ...

  8. 解决mysql java.sql.SQLException: The server time zone value‘XXXXXX' is unrecognized or represents...

    解决 java.sql.SQLException: The server time zone value 'XXXXXX' is unrecognized or represents more tha ...

  9. unity3D 游戏物体同时绑定单击、双击事件

    前言 在unity中我们常用的获取鼠标点击的方法有 在3D场景中,一般用在Update方法中,每一帧调用 void Update(){ )){ Debug.log("鼠标左键点击" ...

  10. FSM有限状态机 ---C#、Unity

    抽象类State public interface State//定义状态接口 { void Init();//初始化 int GetCurrentStateId();//返回当前状态Id void ...