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 相关文章推荐
使用prototype.js进行异步操作
Feb 07 Javascript
isArray()函数(JavaScript中对象类型判断的几种方法)
Nov 26 Javascript
jQuery AjaxQueue改进步骤
Oct 06 Javascript
js触发select onchange事件的小技巧
Aug 05 Javascript
jquery提示效果实例分析
Nov 25 Javascript
浅谈javascript中的instanceof和typeof
Feb 27 Javascript
基于jQuery实现交互体验社会化分享代码附源码下载
Jan 04 Javascript
微信小程序日历组件使用方法详解
Dec 29 Javascript
vue改变对象或数组时的刷新机制的方法总结
Apr 24 Javascript
IE11下CKEditor在Bootstrap Modal中下拉问题的解决
Sep 25 Javascript
微信小程序学习总结(一)项目创建与目录结构分析
Jun 04 Javascript
js实现简单商品筛选功能
Feb 02 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 数组实例说明
2008/08/18 PHP
php 5.6版本中编写一个PHP扩展的简单示例
2015/01/20 PHP
PHP中预定义的6种接口介绍
2015/05/12 PHP
PHP 常用的header头部定义汇总
2015/06/19 PHP
javascript String 的扩展方法集合
2008/06/01 Javascript
被jQuery折腾得半死,揭秘为何jQuery为何在IE/Firefox下均无法使用
2010/01/22 Javascript
javascript函数中的arguments参数
2010/08/01 Javascript
读jQuery之八 包装事件对象
2011/06/21 Javascript
JQuery入门—JQuery程序的代码风格详细介绍
2013/01/03 Javascript
15条JavaScript最佳实践小结
2013/08/09 Javascript
关闭浏览器窗口弹出提示框并且可以控制其失效
2014/04/15 Javascript
select多选 multiple的使用示例
2014/06/16 Javascript
input输入框鼠标焦点提示信息
2015/03/17 Javascript
jQuery解析json格式数据简单实例
2016/01/22 Javascript
js实现可控制左右方向的无缝滚动效果
2016/05/29 Javascript
BootStrap下jQuery自动完成的样式调整
2016/05/30 Javascript
jstree创建无限分级树的方法【基于ajax动态创建子节点】
2016/10/25 Javascript
Angular CLI 安装和使用教程
2017/09/13 Javascript
浅谈Webpack自动化构建实践指南
2017/12/18 Javascript
ExtJs整合Echarts的示例代码
2018/02/27 Javascript
微信小程序swiper禁止用户手动滑动代码实例
2019/08/23 Javascript
vue中beforeRouteLeave实现页面回退不刷新的示例代码
2019/11/01 Javascript
使用vue打包进行云服务器上传的问题
2020/03/02 Javascript
Python编程求解二叉树中和为某一值的路径代码示例
2018/01/04 Python
Python修改文件往指定行插入内容的实例
2019/01/30 Python
Python魔法方法详解
2019/02/13 Python
python机器学习库xgboost的使用
2020/01/20 Python
html5是什么_动力节点Java学院整理
2017/07/07 HTML / CSS
Capitol Lighting的1800lighting.com:住宅和商业照明
2019/04/10 全球购物
俄罗斯领先的移动和数字设备在线商店:Svyaznoy.ru
2020/12/21 全球购物
财务简历的自我评价
2014/03/05 职场文书
在校实习生求职信
2014/06/18 职场文书
六年级作文之关于梦
2019/10/22 职场文书
HashMap实现保存两个key相同的数据
2021/06/30 Java/Android
Python MNIST手写体识别详解与试练
2021/11/07 Python
Windows Server 2016服务器用户管理及远程授权图文教程
2022/08/14 Servers