详解JavaScript正则表达式之分组匹配及反向引用

 更新时间:2016年03月09日 09:09:49   作者:jerrylsxu  
这篇文章主要介绍了详解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.$3 <-> (B|C|D)
//RegExp.$4 <-> (E+) 

以上的代码也同时给出了$1~$9的用法

$1~$9是正则表达式预定义的静态属性,通过RegExp.$1引用

分组嵌套关系说明

上述代码也可以说明分组的嵌套关系

//测试环境 Chrome浏览器
var str = "ABCDE";
var reg = /(A+)((B|C|D)+)(E+)/gi;
str.match(reg);//输出:["ABCDE"]
reg.exec(str,'i');//输出:["ABCDE", "A", "BCD", "D", "E"]
RegExp.$1;//输出:"A"
RegExp.$2;//输出:"BCD"
RegExp.$3;//输出:"D"
RegExp.$4;//输出:"E" 

这样就可以很明白的看出分组的嵌套关系了

总结来说:大的分组中存在小的分组时,小的分组是排在该大分组后面的分组,以此类推

第二部分

这部分主要讲解类似于"\1"这个东西的用法

分组匹配之反向引用

语法

元字符 \1~\9  作用:用来表示前面以匹配的字符或分组的一个引用

用法示例

参考文章:[原]AS3 js正则表达式 反向引用(backreference)

上面说的可能有些拗口,下面给一个例子:

//一般情况,当我们想匹配任意两个相同的字符(复杂一点就是两个相同的分组)时,往往可以借助下面的写法
//说明:
//(\w)用来匹配任何除了换行和制表符的字符, 而\1是对(\w)的一个引用, 所以你可以理解成: (\w)\1 就是(\w)(\w)
//但是,
//(\w)\1 和 (\w)(\w)的不同之处在于, (\w)(\w)表示任意两个连续的字符, 比如Ac, MM, K9, 都可以,
// 但(\w)\1只能是AA, CC, 99 这样连续相同的字符
//所以, 你可以这样理解, \1 是对(\w)的一个实例化引用, 当(\w) 匹配到A时, \1 被表达成A, 当(\w)匹配9时, \1 被表示成9
//说了这么多, 可能有些废话, 下面这个例子就很好理解了
var str = "AA Am 99";
var reg = /(\w)\1/g;
str.match(reg);//输出: ["AA", "99"] 

所以, 参照上边我所引用的文章中给出的 "关键字搜索高亮显示的正则表达用法" 的例子, 我给出自己改进的小的DEMO

虽然这个DEMO没有用到任何的关于反向引用的知识点::>_<::

//测试环境 Chrome浏览器
var key = "keywords";//搜索的关键字
var text = " I am a text, and I have a keywords before this";//待匹配的文本
var reg = new RegExp("("+key+")","g");
text.replace(reg,"<span style='color:red'>$1</span>");//输出: " I am a text, and I have a <span style='color:red'>keywords</span> before this"

下面给大家详细介绍下正则表达式之反向引用

 示例1:

public static void main(String[] args) { 
 String s="99-3933"; 
 boolean b=Pattern.matches("([\\d])\\1[-]([3])\\1\\2{2}", s); 
 System.out.println(b); 
}

反向引用,匹配重复的数字

([\d])====>\1

([3])====>\2

示例2:

public class test { 
 public static void main(String[] args) { 
  String s="99-393399-3933"; 
  boolean b=Pattern.matches("(([\\d])\\2[-]([3])\\2\\3{2})\\1", s); 
  System.out.println(b); 
 } 
}

相关文章

  • 使用typescript+webpack构建一个js库的示例详解

    使用typescript+webpack构建一个js库的示例详解

    这篇文章主要介绍了typescript+webpack构建一个js库,本文主要记录使用typescript配合webpack打包一个javascript library的配置过程,需要的朋友可以参考下
    2022-07-07
  • 关于layui toolbar和template的结合使用方法

    关于layui toolbar和template的结合使用方法

    今天小编就为大家分享一篇关于layui toolbar和template的结合使用方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-09-09
  • 用Javascript 编写可以缓慢弹出收缩的层

    用Javascript 编写可以缓慢弹出收缩的层

    前天老师布置了一道思考题,用Javascript编写可以缓慢弹出收缩的层,折腾了好几个小时,总算写出效果.
    2009-10-10
  • javascript基础练习之翻转字符串与回文

    javascript基础练习之翻转字符串与回文

    最近在学习的时候到了基础算法这一章节,让我对js内置对象方法的掌握还有思维逻辑都得到了提升,所借此机会来写一写学习心得和总结。下面这篇文章主要介绍了利用javascript实现翻转字符串与回文的相关资料,需要的朋友可以参考借鉴,下面来一起看看吧。
    2017-02-02
  • 原生javascript实现图片滚动、延时加载功能

    原生javascript实现图片滚动、延时加载功能

    这篇文章主要介绍了使用原生javascript实现图片滚动、延时加载功能,思路与方法均分享给大家,希望对大家能有所帮助。
    2015-01-01
  • js中符号转意问题示例探讨

    js中符号转意问题示例探讨

    符号转意,大家或许有所了解,知识在使用中或许不是那么的在意,其实这个问题很重要,下面为大家讲解下js符号转意问题相关知识,感兴趣的朋友可以参考下
    2013-08-08
  • js+css实现导航效果实例

    js+css实现导航效果实例

    这篇文章主要介绍了js+css实现导航效果,实例分析了下拉菜单导航的js实现方法,非常具有实用价值,需要的朋友可以参考下
    2015-02-02
  • js判断当前浏览器类型,判断IE浏览器方法

    js判断当前浏览器类型,判断IE浏览器方法

    这篇文章主要介绍了js判断当前浏览器类型,判断IE浏览器方法,需要的朋友可以参考下
    2014-06-06
  • Bootstrap学习笔记之js组件(4)

    Bootstrap学习笔记之js组件(4)

    这篇文章主要为大家详细介绍了Bootstrap学习笔记之js组件,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-06-06
  • js判断浏览器是否支持严格模式的方法

    js判断浏览器是否支持严格模式的方法

    除了正常运行模式,ECMAscript 5添加了第二种运行模式:"严格模式"(strict mode)。顾名思义,这种模式使得Javascript在更严格的条件下运行。这篇文章给大家详细介绍了js判断浏览器是否支持严格模式的方法,有需要的朋友们可以参考借鉴。
    2016-10-10

最新评论