ES6正则表达式的一些新功能总结


Posted in Javascript onMay 09, 2017

本文主要总结了ES6正则表达式的一些新功能,分享出来供大家参考学习,下面来看看详细的介绍:

一、构造函数实例化参数的变化

大家都知道,在ES5中,new RegExp(参数1,参数2),参数1若是指定了正则修饰符,则参数2就不应该出现,否则将会报错,在ES6中,第二个参数的正则修饰符会覆盖掉原有的修饰符:

<script>
//在ES5中,下面的正则自带修饰符ig,则第二个参数不能出现
var reg = new RegExp(/asd/ig);
//在ES6中,如下:
var reg = new RegExp(/asd/ig,'i');
//i会覆盖掉原来的ig
</script>

二、u修饰符

u修饰符可以自动识别码点大于0xFFFF的编码。只是ES6的新增内容!

<script>
/\uD83D/u.test("\uD83D\uDC2A");
//在ES6中会返回false,u修饰符默认处理的UTF-16编码
/\uD83D/.test("\uD83D\uDC2A");
//在ES5中会将test的的参数拆分成两个字符,返回true
</script>

另外使用u修饰符需要注意一下几点:

1. “.”字符

在正则表达式中,.字符的含义是除了换行符以外的所有字符,如要.字符匹配码点大于\uFFFF的字符,必须带u修饰符,否则不能正常识别;

<svcipt>
var s = "��";
//在ES5中
/^.$/.test(s)//false
//在ES6中
/^.$/u.test(s)//true
</script>

2.Unicode字符表示法

ES6中新增使用了大括号表示Unicode字符,这种方法在正则表达式中必须加上u修饰符才能识别。

<svcipt>
//在ES5中,61会被当做量词使用
/\u{61}/.test("a")//false
//在ES6中
/\u{61}/u.test("a")//true
</script>

3.预定义模式

u修饰符也影响到预定义模式,加了u修饰符,才能正确识别码点大于0xFFFF的Unicode字符。

4.对i修饰符的影响

有些Unicode编码的字符比较接近,比如大写的K的编码有\u004B和\u212A,

<svcipt>
//未添加u修饰
/[a-z]/.test("\u212A")//false
//添加u修饰
/[a-z]/iu.test("\u212A")//true
</script>

三、y修饰符

ES6还新增了一个y修饰符,与通常的g修饰符用法类似,都是用来全局匹配,不同的是y修饰符又叫做“粘连”修饰符,在上一次匹配成功的下一个位置开始匹配,但是下一次开始位置必须要能够满足匹配,也就是匹配从剩余的第一个位置开始,这就是“粘连”的含义(个人理解)吧。

举个例子吧!

<svcipt>
var s = qqqq_q_qq;
var r1 = /q+/g;
var r2 = /q+/y
//第一次匹配
r1.exec(s)//["qqqq"]
r2.exec(s)//["qqqq"]
//第二次匹配
r1.exec(s)//["qqq"]
r2.exec(s)//null
</script>

注意:y修饰符隐含了头部匹配的标志^

/a/.exec("bdab");//null
/a/.exec("abbd");//["a"]

开头必须匹配上

四、新增属性

1.sticky属性

      判断正则是否设置了y修饰符。

      返回布尔值。

2.flags属性

      返回正则的修饰符

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
JavaScript 新手24条实用建议[TUTS+]
Jun 21 Javascript
JavaScript 字符串乘法
Aug 20 Javascript
javascript实现在某个元素上阻止鼠标右键事件的方法和实例
Aug 12 Javascript
15款jQuery分布引导插件分享
Feb 04 Javascript
JS弹出可拖拽可关闭的div层完整实例
Feb 13 Javascript
IE下JS保存图片的简单实例
Jul 15 Javascript
BootStrap入门教程(二)之固定的内置样式
Sep 19 Javascript
ES6中箭头函数的定义与调用方式详解
Jun 02 Javascript
jQuery实现返回顶部按钮和scroll滚动功能[带动画效果]
Jul 05 jQuery
jQuery滚动条美化插件nicescroll简单用法示例
Apr 18 jQuery
小程序实现投票进度条
Nov 20 Javascript
浅谈element中InfiniteScroll按需引入的一点注意事项
Jun 05 Javascript
Vuex和前端缓存的整合策略详解
May 09 #Javascript
基于JS实现限时抢购倒计时间表代码
May 09 #Javascript
js使用i18n实现页面国际化的方法
May 09 #Javascript
Angular中$state.go页面跳转并传递参数的方法
May 09 #Javascript
Vue 2.0中生命周期与钩子函数的一些理解
May 09 #Javascript
JavaScript中splice与slice的区别
May 09 #Javascript
详解node中创建服务进程
May 09 #Javascript
You might like
将一维或多维的数组连接成一个字符串的php代码
2010/08/08 PHP
javascript,php获取函数参数对象的代码
2011/02/03 PHP
PHP引用返回用法示例
2016/05/28 PHP
Yii框架使用魔术方法实现跨文件调用功能示例
2017/05/20 PHP
PHP 代码简洁之道(小结)
2019/10/16 PHP
Aster vs Newbee BO5 第三场2.19
2021/03/10 DOTA
js checkbox(复选框) 使用集锦
2009/04/28 Javascript
方便实用的jQuery checkbox复选框全选功能简单实例
2013/10/09 Javascript
一个简单的jquery进度条示例
2014/04/28 Javascript
Jquery EasyUI实现treegrid上显示checkbox并取选定值的方法
2016/04/29 Javascript
Javascript中判断一个值是否为undefined的方法详解
2016/09/28 Javascript
关于angularJs指令的Scope(作用域)介绍
2016/10/25 Javascript
Node.js获取前端ajax提交的request信息
2017/02/20 Javascript
JavaScript截屏功能的实现代码
2017/07/28 Javascript
微信小程序promsie.all和promise顺序执行
2017/10/27 Javascript
详解如何将 Vue-cli 改造成支持多页面的 history 模式
2017/11/20 Javascript
webpack+vue中使用别名路径引用静态图片地址
2017/11/20 Javascript
浅谈JsonObject中的key-value数据解析排序问题
2017/12/06 Javascript
js实现详情页放大镜效果
2020/10/28 Javascript
详解JavaScript中的链式调用
2020/11/27 Javascript
[12:21]VICI vs TNC (BO3)
2018/06/07 DOTA
Python中统计函数运行耗时的方法
2015/05/05 Python
Python 支付整合开发包的实现
2019/01/23 Python
python join方法使用详解
2019/07/30 Python
详解Python3定时器任务代码
2019/09/23 Python
利用python清除移动硬盘中的临时文件
2020/10/28 Python
通过CSS3的object-fit来调整图片适配尺寸的技巧简介
2016/02/27 HTML / CSS
HTML5之web workers_动力节点Java学院整理
2017/07/17 HTML / CSS
罗兰·穆雷官网:Roland Mouret
2018/09/28 全球购物
韩国保养品、日本药妆购物网:小三美日
2018/12/30 全球购物
党员群众路线个人整改措施思想汇报
2014/10/12 职场文书
店铺转让协议书
2014/12/02 职场文书
银行求职信范文怎么写
2015/03/20 职场文书
小学语文新课改心得体会
2016/01/22 职场文书
未来,这5大方向都很适合创业
2019/07/22 职场文书
Python实现简单的俄罗斯方块游戏
2021/09/25 Python