所谓正则表达式,又称规则表达式。(英语:Regular Expression,在代码中常简写为regex、regexp或RE),计算机科学的一个概念。正则表达式通常被用来检索、替换那些符合某个模式(规则)的文本。在之前使用基于Jquery库开发项目的时候,用的正则表达式最多的就是一些输入框的检验,比如检验电话号码或者邮箱的格式是否合适等。

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

  一、参数是字符串,这是第二个参数标识正则表达式的修饰符(flag)。

  var regex = new RegExp('xyz', 'i');

  //  等价于 var regex = /xyz/i;

  二、参数是一个正则表达式,这时会返回一个原有正则表达式的拷贝。

  var regex = new RegExp( /xyz/i) ;

  //  等价于 var regex = /xyz/i;

  但是ES5不允许此时使用第二个参数添加修饰符,即第一种方式,否则就会报错。ES6改变了这种行为,如果RegExp构造函数第一个参数是正则表达式,那么可以使用第二个参数指定修饰符。而且,返回的正则表达式会忽略原有正则表达式的修饰符,只有重新指定。下面为大家介绍一下ES6对正则表达式新增的各种修饰符:

  1、u修饰符

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

  2、y修饰符

  y修饰符又叫粘连,与g修饰符类似,都是从上一次匹配成功的下一个位置开始,只不过y修饰符会确保匹配必须从剩余的第一个位置开始。

  3、s修饰符

  s修饰符就是doAll模式,字符串中所有的字符都匹配,包括换行符(\n)、回车符(\r)等。

  介绍完各种修饰符之后,为大家重点介绍具名组匹配,简而言之就是正则表达式使用圆括号进行组匹配,先看下面一段代码

  

  

 const RE_DATA = /(\d{4})-(\d{2})-(\d{2})/;
const maset = RE_DATA.exec('1999-12-31');
console.log(maset[1]);
console.log(maset[2]);
console.log(maset[3]); //
//
//

组匹配

  看完这段代码是不是觉得之前自己处理时间的时候白白写了很多代码,反正我是这样觉得的,我一直都是对后台传给我的时间字段进行split分隔,显得很low,有了组匹配是不是高大上了很多,嘿嘿。

  所谓具名组匹配就是在圆括号内部,在模式的头部添加“问号 + 尖括号 + 组名”,然后在exec方法中返回结果的groups属性上引用该组名,看下面代码

  

 const RE_DATA_REG = /(?<year>\d{4})-(?<month>\d{2})-(?<day>\d{2})/;

 const maset_re = RE_DATA_REG.exec('1999-12-31');

 console.log(maset_re.groups.year);
console.log(maset_re.groups.year);
console.log(maset_re.groups.year); //
//
//

ES6标准入门之正则表达式的拓展的更多相关文章

  1. ES6标准入门之数值的拓展解说

    ES6提供了二进制和八进制数值的新写法,分别用前缀0b(或0B)和0o(或0O)表示. 0b111110111 === 503                    // true 0o767 === ...

  2. ES6标准入门之字符串的拓展讲解

    在开始讲解ES6中字符串拓展之前,我们先来看一下ES5中字符串的一些方法. 获取字符串长度 str.length 分割字符串 str.split() 拼接字符串 str1+str2 或 str1.co ...

  3. ES6标准入门之变量的解构赋值简单解说

    首先我们来看一看解构的概念,在ES6标准下,允许按照一定模式从数组和对象中提取值,然后对变量进行赋值,这被称作解构,简而言之粗糙的理解就是变相赋值. 解构赋值的规则是,只要等号右边的值不是对象或者数组 ...

  4. 【学习笔记】ES6标准入门

    这里简要记录一下对自己感触比较深的几个知识点,将核心的应用投放于实际的项目之中,提供代码的可维护性. 一.let和const { // let声明的变量只在let命令所在的代码块内有效 let a = ...

  5. [转] 《ES6标准入门》读书笔记

    来源:https://segmentfault.com/a/1190000005863641 let和const命令 ES6新增let命令,用于声明变量,是块级作用域. let声明的变量不会像var声 ...

  6. ES6标准入门 第一章:简介

    ECMAScript 6 是JavaScript 语言的下一代标准:发布于2015年,又称为ECMAScript 2015. ECMAScript 与 JavaScript 的关系:前者是后者的规范, ...

  7. ES6标准入门 第五章:正则的扩展

    1.RegExp 构造函数 ES5的缺陷: ES5中构造函数的参数有两种情况: (1)参数是字符串,这时第二个参数表示正则表达式的的修饰符(flag). var reg = new RegExp( & ...

  8. ES6标准入门(第三版).pdf----推荐指数⭐⭐⭐⭐⭐

    链接: https://pan.baidu.com/s/13RHsyTMNx7s1oMqQeYCm3Q 提取码: ikg3 -------------------------------------- ...

  9. 《ES6标准入门》(阮一峰)--11.对象的新增方法

    1.Object.is() ES5 比较两个值是否相等,只有两个运算符:相等运算符(==)和严格相等运算符(===).它们都有缺点,前者会自动转换数据类型,后者的NaN不等于自身,以及+0等于-0.J ...

随机推荐

  1. Extjs4 store load 有中文字符提交后台乱码解决方法

    一.在load提交时对字符串进行decode处理. {name : encodeURIComponent(value)} 然后在后端进行反编码 java.net.URLDecoder.decode(n ...

  2. Thinkphp 全选、反选 批量删除

    完整案例 前台 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www ...

  3. Java多线程--JDK并发包(1)

    Java多线程--JDK并发包(1) 之前介绍了synchronized关键字,它决定了额一个线程是否可以进入临界区:还有Object类的wait()和notify()方法,起到线程等待和唤醒作用.s ...

  4. Web前端基础——HTML

    一 .HTML 概述 HTML : 超文本标记语言 HyperText markup language <marquee behavior="alternate"> & ...

  5. 【转】classpath和环境变量设置

    http://www.360doc.com/content/12/0722/14/820209_225797366.shtml 在没有设置环境变量之前,我们可以通过直接在应用程序中加带相关信息来运行我 ...

  6. 漫画 | Java多线程与并发(一)

    1.什么是线程? 2.线程和进程有什么区别? 3.如何在Java中实现线程? 4.Java关键字volatile与synchronized作用与区别? volatile修饰的变量不保留拷贝,直接访问主 ...

  7. Chromium源码--网络请求流程分析

    转载请注明出处:http://www.cnblogs.com/fangkm/p/3784660.html 本文探讨一下chromium中加载URL的流程,具体来说是从地址栏输入URL地址到通过URLR ...

  8. ThinkPHP5事务回滚

    使用事务处理的话,需要数据库引擎支持事务处理.比如 MySQL 的 MyISAM 不支持事务处理,需要使用 InnoDB 引擎. 使用 transaction 方法操作数据库事务,当发生异常会自动回滚 ...

  9. 【代码笔记】iOS-MBProgressHUDDemo

    一,工程图. 二,代码. RootViewController.h #import <UIKit/UIKit.h> //加入头文件 #import "MBProgressHUD. ...

  10. 怎么配置wamp下mysql的编码

    Windows下的Apache+Mysql/MariaDB+Perl/PHP/Python,一组常用来搭建动态网站或者服务器的开源软件,本身都是各自独立的程序,但是因为常被放在一起使用,拥有了越来越高 ...