原文地址: JS正则表达式的分组匹配

什么是分组

通俗来说,我理解的分组就是在正则表达式中用()包起来的内容代表了一个分组,像这样的:

var reg = /(\d{2})/
reg.test('12');  //true

这里reg中的(/d{2})就表示一个分组,匹配两位数字

分组内容的的形式

一个分组中可以像上面这样有一个具体的表达式,这样可以优雅地表达一个重复的字符串

/hahaha/
/(ha){3}/

这两个表达式是等效的,但有了分组之后可以更急简洁。

体格分组中还可以有多个候选表达式,例如

var reg = /I come from (hunan|hubei|zhejiang)/;
reg.test('I come from hunan');   //true
reg.test('I come from hubei'); //true

也就是说在这个分组中,通过|隔开的几个候选表达式是并列的关系,所以可以把这个|理解为或的意思

分组的分类

分组有四种类型

  • 捕获型 ()
  • 非捕获型 (?:)
  • 正向前瞻型 (?=)
  • 反向前瞻型 (?!)
    我们使用的比较多的都是捕获型分组,只有这种分组才会暂存匹配到的串

分组的应用

分组在正则中还算使用的比较广泛的,我们常用的是捕获型分组

  • 捕获与引用

    • 被正则表达式捕获(匹配)到的字符串会被暂存起来,其中,由分组捕获到的字符串会从1开始编号,于是我们可以引用这些字符串:
    var reg = /(\d{4})-(\d{2})-(\d{2})/;
    var dateStr = '2018-04-18';
    reg.test(dateStr);  //true RegExp.$1 //2018 RegExp.$2 //04 RegExp.$3 //18
  • 结合replace方法做字符串自定义替换
    • String.prototype.replace方法的传参中可以直接引用被捕获的串,比如我们想开发中常见的日期格式替换,例如后台给你返回了一个2018/04/18,让你用正则替换为2018-04-18,就可以利用分组
    var dateStr = '2018/04/18';
    var reg = /(\d{4})\/(\d{2})\/(\d{2})/;
    dateStr = dateStr.replace(reg, '$1-$2-$3') //"2018-04-18"

    不过这里需要注意的是/是需要用\转义的

  • 反向引用
    • 正则表达式里也能进行引用,这称为反向引用:
    var reg = /(\w{3}) is \1/
    reg.test('kid is kid') // true
    reg.test('dik is dik') // true reg.test('kid is dik') // false reg.test('dik is kid') // false
    • 需要注意的是,如果引用了越界或者不存在的编号的话,就被被解析为普通的表达式
    var reg = /(\w{3}) is \6/;
    reg.test( 'kid is kid' ); // false
    reg.test( 'kid is \6' ); // true
  • 非捕获型分组
    • 有的时候只是为了分组并不需要捕获的情况下就可以使用非捕获型分组,例如
    var reg = /(?:\d{4})-(\d{2})-(\d{2})/
    var date = '2012-12-21'
    reg.test(date)
    RegExp.$1 // 12 RegExp.$2 // 21
  • 正向与反向前瞻型分组
    • 正向前瞻型分组:你站在原地往前看,如果前方是指定的东西就返回true,否则为false
    var reg = /kid is a (?=doubi)/
    reg.test('kid is a doubi') // true
    reg.test('kid is a shabi') // false
    • 反向前瞻型分组:你站在原地往前看,如果前方不是指定的东西则返回true,如果是则返回false
    var reg = /kid is a (?!doubi)/
    reg.test('kid is a doubi') // false
    reg.test('kid is a shabi') // true
  • 既然前瞻型分组和非捕获型分组都不会捕获,那他们有什么区别呢?先看例子:
var reg, str = "kid is a doubi";
reg = /(kid is a (?:doubi))/
reg.test(str) RegExp.$1 // kid is a doubi reg = /(kid is a (?=doubi))/ reg.test(str) RegExp.$1 // kis is a

也就是说非捕获型分组匹配到的字符串任然会被外层分组匹配到,而前瞻型不会,所以如果你希望在外层分组中不匹配里面分组的值的话就可以使用前瞻型分组了。

转载于:https://www.cnblogs.com/liujinyu/p/11102977.html

JS正则表达式的分组匹配相关推荐

  1. JavaScript正则表达式的分组匹配详解

    1,分组 下面的正则表达式可以匹配kidkidkid: const reg = /kidkidkid/ 而另一种更优雅的写法是: const reg = /(kid){3}/ 这里由圆括号包裹的一个小 ...

  2. JS 正则表达式(正则匹配RegExp)

    JavaScript实现对象深拷贝的方法(5种) 知识回调(不懂就看这儿!) 场景复现 核心干货 举例引入 关于RegExp对象 语法 修饰符--区分大小写和全局匹配 方括号--查找某个范围内的字符 ...

  3. js正则表达式之人民币匹配

    人民币格式匹配 小写格式:¥ 符号 和 整数值 与小数3部分组成. (0)代码与运行结果 {// 匹配人民币let [reg, info, rmb, result] = [/^(¥)(-?[0-9,] ...

  4. js正则表达式 URL格式匹配详解

    0.URL格式 protocol :// hostname[:port] / path / [;parameters][?query]#fragment [;parameters]没见过 这里就不做相 ...

  5. js正则表达式 URL格式匹配 http替换成https

    匹配替换http为https: function urlConversion(path) {let reg = /^(https?:\/\/)([0-9a-z.]+)(:[0-9]+)?([/0-9a ...

  6. JS 正则表达式否定匹配(正向前瞻)

    引言 JS 正则表达式是 JS 学习过程中的一大难点,繁杂的匹配模式足以让人头大,不过其复杂性和其学习难度也赋予了它强大的功能.文章从 JS 正则表达式的正向前瞻说起,实现否定匹配的案例.本文适合有一 ...

  7. Js读取Cookie中指定字段的值,Js中读取某个Cookie,Js中根据Cookie的key得到对应的value,Js正则表达式匹配指定的Cookie

    Js中想要读取Cookie中指定字段的值,可以遍历Cookie根据指定Key提取Cookie,或者使用正则表达式匹配Cookie,代码如下: /*** @description: 遍历cookie得到 ...

  8. js正则表达式匹配span标签

    1.js正则表达式匹配span标签 const spans = htmlStr.match(/<span (.*?)>(.*?)<\/span>/g) 2.js正则表达式–获取 ...

  9. js正则表达式匹配字符串与优化过程

    前言 有时候需要实现对js源文件中的url字符串做拦截预处理,或者前端js语法高亮,或者需要对动态加载的关键源码做混淆保护,在某些步骤实现之前,有一个步骤是需要提炼出所有的合法字符串. 目标:检测源文 ...

最新文章

  1. 表情显示服务器异常,MySqlmoji表情引发的存储异常微信昵称
  2. redis的key和value限制
  3. 数据湖之iceberg系列(三)iceberg快速入门
  4. 拳王虚拟项目公社:闲鱼知乎引流售卖虚拟资源的虚拟兼职副业项目实操
  5. zabbix3.0.4 邮件告警详细配置
  6. Oracle shared_pool_reserved_size参数设置说明
  7. android activity 通知 service,android activity和service通信问题
  8. MySQL数据库无法启动的简单排错
  9. 基于Flask框架实现Mock Server
  10. Boost.Asio使用总结
  11. 移动端网页字体过多时,字体被自动放大问题
  12. ABAP 客户主数据批量导入
  13. Source Insight4.0字体大小及护眼背景配置
  14. java8新特性学习笔记(Lambda,stream(),filter(),collect(),map())
  15. Js 时间间隔计算(间隔天数)
  16. 侃一侃人工智能2-零散的人工智能概念
  17. 中国知名IT企业的资料
  18. MySQL数据库集群实战(1)——MySQL数据库基础知识
  19. 喂~你那里下雪了吗?
  20. Python OpenCV中的Stitcher.stitch图像拼接方法介绍(详细)

热门文章

  1. hdu 5144 NPY and shot(三分)
  2. windbg学习22(!dh和!lmi)
  3. Linux基本操作(6)——Linux 重写rm 命令 实现回收站功能
  4. SecureCRT使用过程中 光标会丢失的问题
  5. 设计模式16_策略模式
  6. 不写代码不用Excel,如何制作高大上的财务分析?
  7. 计算机网络在实践中的应用,计算机网络技术在实践中的应用
  8. 使用fetch函数发送ajax
  9. 嵌入式系统功能需求分析_机械管理系统如何物料需求分析
  10. python基础语法实验报告小结_Python基础小结