详解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 相关文章推荐
js购物车实现思路及代码(个人感觉不错)
Dec 23 Javascript
js中switch case循环实例代码
Dec 30 Javascript
js实现绿白相间竖向网页百叶窗动画切换效果
Mar 02 Javascript
C++中的string类的用法小结
Aug 07 Javascript
JS实现点击按钮获取页面高度的方法
Nov 02 Javascript
详解AngularJS Filter(过滤器)用法
Dec 28 Javascript
Vue.js实现一个todo-list的上移下移删除功能
Jun 26 Javascript
基于BootStrap实现简洁注册界面
Jul 20 Javascript
Vue cli3 库模式搭建组件库并发布到 npm的流程
Oct 12 Javascript
KnockoutJS数组比较算法实例详解
Nov 25 Javascript
vue中改变滚动条样式的方法
Mar 03 Javascript
vue-cli —— 如何局部修改Element样式
Oct 22 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
IIS php环境配置PHP5 MySQL5 ZendOptimizer phpmyadmin安装与配置
2008/11/18 PHP
Linux系统中设置多版本PHP共存配合Nginx服务器使用
2015/12/21 PHP
thinkPHP实现签到功能的方法
2017/03/15 PHP
PHP使用SMTP邮件服务器发送邮件示例
2018/08/28 PHP
ThinkPHP 5 AJAX跨域请求头设置实现过程解析
2020/10/28 PHP
javascript淡入淡出效果的实现思路
2012/03/31 Javascript
点击弹出层外区域关闭弹出层jquery特效示例
2013/08/25 Javascript
jQuery实现鼠标悬停显示提示信息窗口的方法
2015/04/30 Javascript
一道常被人轻视的web前端常见面试题(JS)
2016/02/15 Javascript
jquery实现异步加载图片(懒加载图片一种方式)
2017/04/24 jQuery
vue axios 在页面切换时中断请求方法 ajax
2018/03/05 Javascript
浅谈在Vue.js中如何实现时间转换指令
2019/01/06 Javascript
vuex 实现getter值赋值给vue组件里的data示例
2019/11/05 Javascript
vue 中url 链接左边的小图标更改问题
2019/12/30 Javascript
JavaScript使用canvas绘制随机验证码
2020/02/17 Javascript
Node.js中出现未捕获异常的处理方法
2020/06/29 Javascript
vue中实现点击变成全屏的多种方法
2020/09/27 Javascript
Nuxt.js nuxt-link与router-link的区别说明
2020/11/06 Javascript
Python使用htpasswd实现基本认证授权的例子
2014/06/10 Python
python使用reportlab实现图片转换成pdf的方法
2015/05/22 Python
分析Python中解析构建数据知识
2018/01/20 Python
Python实现修改文件内容的方法分析
2018/03/25 Python
python通过http下载文件的方法详解
2019/07/26 Python
Python 调用 Windows API COM 新法
2019/08/22 Python
用Python实现校园通知更新提醒功能
2019/11/23 Python
Python创建文件夹与文件的快捷方法
2020/12/08 Python
CK巴西官方网站:Calvin Klein巴西
2019/07/19 全球购物
"火柴棍式"程序员面试题
2014/03/16 面试题
大学生活学习的自我评价
2013/12/03 职场文书
新书发布会策划方案
2014/06/09 职场文书
财务工作犯错检讨书
2014/10/07 职场文书
2015年世界卫生日活动总结
2015/02/09 职场文书
爱岗敬业先进典型事迹材料(2016推荐版)
2016/02/26 职场文书
2019年手机市场的调研报告2篇
2019/10/10 职场文书
Python绘制分类图的方法
2021/04/20 Python
SQLServer权限之只开启创建表权限
2022/04/12 SQL Server