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/wancheng7/p/8906015.html

时间: 2024-10-25 13:50:03

JS正则表达式的分组匹配的相关文章

JS正则表达式获取分组内容实例

JS正则表达式获取分组内容. 支持多次匹配的方式: var testStr = "now test001 test002"; var re = /test(\d+)/ig; var r = ""; while(r = re.exec(testStr)) { alert(r[0] + " " + r[1]); } 此外也可以用testStr.match(re),但是这样的话就不能有g的选项,而且只能得到第一个匹配. 另外备忘一下:正则表达式对象的属

JavaScript正则表达式之分组匹配

语法 元字符:(pattern) 作用:用于反复匹配的分组 属性$1~$9 如果它(们)存在,用于得到对应分组中匹配到的子串 \1或$1 用于匹配第一个分组中的内容 \2或$2 用于匹配第一个分组中的内容 ... \9或$9 用于匹配第一个分组中的内容 用法示例 var reg = /(A+)((B|C|D)+)(E+)/gi;//该正则表达式有4个分组 //对应关系 //RegExp.$1 <-> (A+) //RegExp.$2 <-> ((B|C|D)+) //RegExp.

JS 正则表达式的位置匹配ZZ

http://regexpal.com/ 上面这个网站可以用于在线检测JS的正则表达式语法 除了熟知的几个固定字符表示位置: ^ : Match the beginning of the string and, in multiline searches, the beginning of a line. $ : Match the end of the string and, in multiline searches, the end of a line. \b: Match a word

js正则表达式验证、匹配数字、匹配字符串、匹配中文、匹配任意字符备忘录

本文转自:91博客 :原文地址:http://www.9191boke.com/235792704.html 正则表达式或“regex”用于匹配字符串的各个部分,下面是我创建正则表达式的备忘录.包括一些常用的验证.匹配数字.匹配字符串.匹配中文.匹配任意字符串. 匹配正则 使用 .test() 方法 let testString = "My test string"; let testRegex = /string/; testRegex.test(testString); 匹配多个模

js 正则表达式,分组非捕获

定位一个字符串中,匹配与定位重复字符中的最后一个字符: 例子: <script type="text/javascript"> var str="http://www.cnblogs.com/cn-coder//img.ipg"; var patt1 = /\/\/(?!.*\/\/)/ig; document.write(str.replace(patt1,"/"));//http://www.cnblogs.com/cn-code

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

人民币格式匹配 小写格式:¥ 符号 和 整数值 与小数3部分组成. (0)代码与运行结果 { // 匹配人民币 let [reg, info, rmb, result] = [ /^(¥)(-?[0-9,]+)(\.[0-9]+)?/, ['金额','符号', '整数部分', '小数分部'], ['¥10.01', '¥10', '¥1,111.01', '¥1,000,12', '¥0.1', '¥10.00'] ]; rmb.forEach((value) => { console.log(

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

0.URL格式 protocol :// hostname[:port] / path / [;parameters][?query]#fragment [;parameters]没见过 这里就不做相关匹配了 1.代码及运行结果 'use strict'; { // URL地址匹配格式: protocol :// hostname[:port] / path / [;parameters][?query]#fragment // [;parameters]:这都没见过这东西,就不匹配了. let

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

引言:JS 正则表达式是 JS 学习过程中的一大难点,繁杂的匹配模式足以让人头大,不过其复杂性和其学习难度也赋予了它强大的功能.文章从 JS 正则表达式的正向前瞻说起,实现否定匹配的案例.本文适合有一定 JS 正则表达式基础的同学,如果对正则表达式并不了解,还需先学习基础再来观摩这门否定大法. 一.标签过滤需求 不知道大家在写JS有没有遇到过这样的情况,当你要处理一串字符串时,需要写一个正则表达式来匹配当中不是 XXX 的文本内容.听起来好像略有些奇怪,匹配不是 XXX 的内容,不是 XXX 我

JS正则表达式从入门到入土(7)—— 分组

分组 在使用正则的时候,有时候会想要匹配一串字符串连续出现多次的情况,比如:我想匹配字符串Byron连续出现3次的情况. 有些人会直接写: Byron{3} 但是,这种情况仅仅会匹配Byro加上三个n,显然,这样是错误的. 要想实现之前的需求,我们需要使用正则表达式的分组功能:使用()可以达到分组的功能,使量词作用于分组.所以,如下正则可以顺利匹配Byron三次 (Byron){3} 或 JS中的|的含义是或,在正则中,我们也可以使用|达成或的效果.比较常用的或的写法是: Byron | Cas