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


Posted in Javascript onMarch 09, 2016

语法

元字符:(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); 
 } 
}
Javascript 相关文章推荐
jQuery 添加/移除CSS类实现代码
Feb 11 Javascript
JS判断元素为数字的奇异写法分享
Aug 01 Javascript
js关闭模态窗口刷新父页面或跳转页面
Dec 13 Javascript
重构Javascript代码示例(重构前后对比)
Jan 23 Javascript
模拟一个类似百度google的模糊搜索下拉列表
Apr 15 Javascript
js控制href内容的连接内容的变化示例
Apr 30 Javascript
郁闷!ionic中获取ng-model绑定的值为undefined如何解决
Aug 27 Javascript
微信小程序实现长按删除图片的示例
May 18 Javascript
Echart折线图手柄触发事件示例详解
Dec 16 Javascript
在vue中阻止浏览器后退的实例
Nov 06 Javascript
JS实现简易留言板增删功能
Feb 08 Javascript
jQuery实现开关灯效果
Aug 02 jQuery
javascript html5移动端轻松实现文件上传
Mar 27 #Javascript
javascript事件绑定学习要点
Mar 09 #Javascript
js实现分割上传大文件
Mar 09 #Javascript
js实现ctrl+v粘贴上传图片(兼容chrome、firefox、ie11)
Mar 09 #Javascript
基于jQuery的网页影音播放器jPlayer的基本使用教程
Mar 08 #Javascript
利用jQuery设计一个简单的web音乐播放器的实例分享
Mar 08 #Javascript
Bootstrap~多级导航(级联导航)的实现效果【附代码】
Mar 08 #Javascript
You might like
Laravel框架学习笔记(一)环境搭建
2014/10/15 PHP
浅析php单例模式
2014/11/25 PHP
PHP获取数组的键与值方法小结
2015/06/13 PHP
微信开发之php表单微信中自动提交两次问题解决办法
2017/01/08 PHP
Thinkphp 框架基础之入口文件功能、定义与用法分析
2020/04/27 PHP
jquery 常用操作方法
2010/01/28 Javascript
js获得指定控件输入光标的坐标兼容IE,Chrome,火狐等多种主流浏览器
2013/05/21 Javascript
javascript中apply和call方法的作用及区别说明
2014/02/14 Javascript
jquery 按键盘上的enter事件
2014/05/11 Javascript
javascript实现动态模态绑定grid过程代码
2014/09/22 Javascript
javascript动态创建及删除元素的方法
2014/12/22 Javascript
jQuery中[attribute!=value]选择器用法实例
2014/12/31 Javascript
基于JavaScript实现表单密码的隐藏和显示出来
2016/03/02 Javascript
AngularJs bootstrap搭载前台框架——基础页面
2016/09/01 Javascript
JavaScript中最容易混淆的作用域、提升、闭包知识详解(推荐)
2016/09/05 Javascript
jQuery常用样式操作实例分析(获取、设置、追加、删除、判断等)
2016/09/08 Javascript
JS实现随机颜色的3种方法与颜色格式的转化
2017/01/05 Javascript
easyUI combobox实现联动效果
2017/01/17 Javascript
jQuery开源组件BootstrapValidator使用详解
2017/06/29 jQuery
vue-cli脚手架config目录下index.js配置文件的方法
2018/03/13 Javascript
JS实现导出Excel的五种方法详解【附源码下载】
2018/03/15 Javascript
CountUp.js数字滚动插件使用方法详解
2019/10/17 Javascript
微信小程序绑定手机号获取验证码功能
2019/10/22 Javascript
javascript设计模式之迭代器模式
2020/01/30 Javascript
JavaScript实现简单贪吃蛇效果
2020/03/09 Javascript
高效使用Python字典的清单
2018/04/04 Python
python脚本第一行如何写
2020/08/30 Python
纯CSS3制作的简洁蓝白风格的登录模板(非IE效果更好)
2013/08/11 HTML / CSS
英国天然有机美容护肤品:Neal’s Yard Remedies
2018/05/05 全球购物
英国鹦鹉店:Parrot Essentials
2018/12/03 全球购物
学习十八大宣传标语
2014/10/09 职场文书
民主生活会发言材料
2014/10/20 职场文书
会计手工模拟做账心得体会
2016/01/22 职场文书
七年级作文(600字3篇)
2019/09/24 职场文书
JavaGUI模仿QQ聊天功能完整版
2021/07/04 Java/Android
Python使用OpenCV实现虚拟缩放效果
2022/02/28 Python