详解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 相关文章推荐
NiftyCube——轻松实现圆角边框
Feb 20 Javascript
使用JavaScript动态设置样式实现代码(2)
Jan 25 Javascript
node.js正则表达式获取网页中所有链接的代码实例
Jun 03 Javascript
深入分析jquery解析json数据
Dec 09 Javascript
jQuery关键词说明插件cluetip使用指南
Apr 21 Javascript
jquery单击事件和双击事件冲突解决方案
Mar 02 Javascript
Angular2表单自定义验证器的实现
Oct 19 Javascript
js实现图片懒加载效果
Jul 17 Javascript
微信小程序中如何使用flyio封装网络请求
Jul 03 Javascript
ant-design-vue 快速避坑指南(推荐)
Jan 21 Javascript
vue3+typescript实现图片懒加载插件
Oct 26 Javascript
小程序自定义弹框效果
Nov 16 Javascript
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
php中利用explode函数分割字符串到数组
2014/02/08 PHP
PHP session垃圾回收机制实例分析
2019/06/28 PHP
javascript读取RSS数据
2007/01/20 Javascript
JS 控制CSS样式表
2009/08/20 Javascript
再谈ie和firefox下的document.all属性
2009/10/21 Javascript
JavaScript基础语法让人疑惑的地方小结
2012/05/23 Javascript
JS的Document属性和方法小结
2013/09/17 Javascript
JS实现表格数据各种搜索功能的方法
2015/03/03 Javascript
JavaScript中计算网页中某个元素的位置
2015/06/10 Javascript
js实现图片上传并正常显示
2015/12/19 Javascript
实例讲解JavaScript的Backbone.js框架中的View视图
2016/05/05 Javascript
浅谈js和css内联外联注意事项
2016/06/30 Javascript
ionic 自定义弹框效果
2017/06/27 Javascript
React Native 使用Fetch发送网络请求的示例代码
2017/12/02 Javascript
vue 组件使用中的一些细节点
2018/04/25 Javascript
jQuery实现的简单拖拽功能示例【测试可用】
2018/08/14 jQuery
Vue2.0点击切换类名改变样式的方法
2018/08/22 Javascript
记一次webapck4 配置文件无效的解决历程
2018/09/19 Javascript
[01:28:44]DOTA2-DPC中国联赛定级赛 RNG vs iG BO3第一场 1月10日
2021/03/11 DOTA
Python调用adb命令实现对多台设备同时进行reboot的方法
2018/10/15 Python
Python 实现文件打包、上传与校验的方法
2019/02/13 Python
对Python的多进程锁的使用方法详解
2019/02/18 Python
Python 函数绘图及函数图像微分与积分
2019/11/20 Python
Python计算机视觉里的IOU计算实例
2020/01/17 Python
Django URL参数Template反向解析
2020/11/24 Python
Peter Alexander新西兰站:澳大利亚领先的睡衣设计师品牌
2016/12/10 全球购物
美国和加拿大房车出售在线分类广告:RVT.com
2018/04/23 全球购物
Bodum官网:咖啡和茶壶、玻璃器皿、厨房电器等
2018/08/01 全球购物
Invicta手表官方商店:百年制表历史的瑞士腕表品牌
2019/09/26 全球购物
大二学生学习个人自我评价
2014/01/19 职场文书
会议活动邀请函
2014/01/27 职场文书
党员承诺书内容
2014/03/26 职场文书
幸福中国演讲稿
2014/09/12 职场文书
学生逃课万能检讨书2000字
2015/02/17 职场文书
社区党务工作总结2015
2015/05/19 职场文书
化工厂员工工作总结
2015/10/15 职场文书