JS正则表达式学习之贪婪和非贪婪模式实例总结


Posted in Javascript onDecember 26, 2016

本文实例总结了JS正则表达式贪婪和非贪婪模式。分享给大家供大家参考,具体如下:

首先上一段js代码:

<script>
try{
 str="<p>abcdefg</p><p>abcdefghijkl</p>";
 re1=str.match(/<p>[\W\w]+?<\/p>/ig);
 alert("非贪婪模式:\r\n\r\n1:"+re1[0]+"\r\n2:"+re1[1]);
 re1=str.match(/<p>[\W\w]+<\/p>/ig);
 alert("贪婪模式:\r\n\r\n"+re1);
 re1=str.match(/<p>(.+?)<\/p>/i);
 alert("非贪婪模式,且不要标记:\r\n\r\n1:"+re1[1]);
 re1=str.match(/<p>(.+)<\/p>/i);
 alert("贪婪模式,且不要标记:\r\n\r\n"+re1[1]);
}catch(e){
 alert(e.description)
}
</script>

下边给出一些例子:

贪婪模式:

在使用修饰匹配次数的特殊符号时,有几种表示方法可以使同一个表达式能够匹配不同的次数,比如:"{m,n}", "{m,}", "?", "*", "+",具体匹配的次数随被匹配的字符串而定。这种重复匹配不定次数的表达式在匹配过程中,总是尽可能多的匹配。比如,针对文本 "dxxxdxxxd",举例如下:

贪婪模式:

表达式 匹配结果
(d)(\w+) "\w+" 将匹配第一个 "d" 之后的所有字符 "xxxdxxxd"
(d)(\w+)(d) "\w+" 将匹配第一个 "d" 和最后一个 "d" 之间的所有字符 "xxxdxxx"。 虽然 "\w+" 也能够匹配上最后一个 "d",但是为了使整个表达式匹配成功, "\w+" 可以 "让出" 它本来能够匹配的最后一个 "d"
 

由此可见,"\w+" 在匹配的时候,总是尽可能多的匹配符合它规则的字符。
虽然第二个举例中,它没有匹配最后一个 "d",但那也是为了让整个表达式能够匹配成功。
同理,带 "*" 和 "{m,n}" 的表达式都是尽可能地多匹配,带 "?" 的表达式在可匹配可不匹配的时候,
也是尽可能的 "要匹配"。这 种匹配原则就叫作 "贪婪" 模式 。

非贪婪模式:

在修饰匹配次数的特殊符号后再加上一个 "?" 号,则可以使匹配次数不定的表达式尽可能少的匹配,使可匹配可不匹配的表达式,尽可能的 "不匹配"。这种匹配原则叫作 "非贪婪" 模式,也叫作 "勉强" 模式。如果少匹配就会导致整个表达式匹配失败的时候,与贪婪模式类似,非贪婪模式会最小限度的再匹配一些,以使整个表达式匹配成功。举例如下,针对文本 "dxxxdxxxd" 举例:

表达式 匹配结果
(d)(\w+?) "\w+?" 将尽可能少的匹配第一个 "d" 之后的字符, 结果是:"\w+?" 只匹配了一个 "x"
(d)(\w+?)(d) 为了让整个表达式匹配成功,"\w+?" 不得不匹配 "xxx" 才可以让后边的 "d" 匹配, 从而使整个表达式匹配成功。因此,结果是:"\w+?" 匹配 "xxx"

更多的情况,举例如下:

举例1:表达式 "<td>(.*)</td>" 与字符串 "<td><p>aa</p></td> <td><p>bb</p></td>" 匹配时,匹配的结果是:成功;匹配到的内容是 "<td><p>aa</p></td> <td><p>bb</p></td>" 整个字符串, 表达式中的 "</td>" 将与字符串中最后一个 "</td>" 匹配。

举例2:相比之下,表达式 "<td>(.*?)</td>" 匹配举例1中同样的字符串时,将只得到 "<td><p>aa</p></td>", 再次匹配下一个时,可以得到第二个 "<td><p>bb</p></td>"。

Javascript 相关文章推荐
javascript 对象定义方法 简单易学
Mar 22 Javascript
jQuery.event兼容各浏览器的event详细解析
Dec 18 Javascript
jQuery aminate方法定位到页面具体位置
Dec 26 Javascript
JavaScript在IE和FF下的兼容性问题
May 19 Javascript
JavaScript动态添加style节点的方法
Jun 09 Javascript
AngularJs  Understanding Angular Templates
Sep 02 Javascript
jQuery Validate验证表单时多个name相同的元素只验证第一个的解决方法
Dec 24 Javascript
jQuery获取单选按钮radio选中值与去除所有radio选中状态的方法
May 20 jQuery
webpack打包单页面如何引用的js
Jun 07 Javascript
JS 组件系列之Bootstrap Table的冻结列功能彻底解决高度问题
Jun 30 Javascript
Vue项目中添加锁屏功能实现思路
Jun 29 Javascript
vsCode安装使用教程和插件安装方法
Aug 24 Javascript
Bootstrap源码解读媒体对象、列表组和面板(10)
Dec 26 #Javascript
Bootstrap 轮播(Carousel)插件
Dec 26 #Javascript
基于ajax与msmq技术的消息推送功能实现代码
Dec 26 #Javascript
Bootstrap源码解读标签、徽章、缩略图和警示框(8)
Dec 26 #Javascript
js正则表达式惰性匹配和贪婪匹配用法分析
Dec 26 #Javascript
Bootstrap的modal拖动效果
Dec 25 #Javascript
原生ajax处理json格式数据的实例代码
Dec 25 #Javascript
You might like
php中通过curl检测页面是否被百度收录
2013/09/27 PHP
Discuz7.2版的faq.php SQL注入漏洞分析
2014/08/06 PHP
PHP实现动态柱状图改进版
2015/03/30 PHP
php中实现用数组妩媚地生成要执行的sql语句
2015/07/10 PHP
JavaScript编程开发中的五个实用小技巧
2010/07/22 Javascript
JS 面向对象之神奇的prototype
2011/02/26 Javascript
javascript中文本框中输入法切换的问题
2013/12/10 Javascript
JavaScript的常见兼容问题及相关解决方法(chrome/IE/firefox)
2013/12/31 Javascript
javascript自动给文本url地址增加链接的方法分享
2014/01/20 Javascript
JS案例分享之金额小写转大写
2014/05/15 Javascript
基于Bootstrap和jQuery构建前端分页工具实例代码
2016/11/23 Javascript
jQuery生成假加载动画效果
2016/12/01 Javascript
Map.vue基于百度地图组件重构笔记分享
2017/04/17 Javascript
jQuery为某个div加入行样式
2017/06/09 jQuery
vue中axios解决跨域问题和拦截器的使用方法
2018/03/07 Javascript
vue中typescript装饰器的使用方法超实用教程
2019/06/17 Javascript
javascript中的相等操作符(==与===区别)
2019/12/21 Javascript
js实现抽奖功能
2020/11/24 Javascript
[55:42]VG vs VGJ.T 2018国际邀请赛淘汰赛BO1 8.21
2018/08/22 DOTA
Python实现模拟分割大文件及多线程处理的方法
2017/10/10 Python
Python I/O与进程的详细讲解
2019/03/08 Python
django的model操作汇整详解
2019/07/26 Python
python实现将一维列表转换为多维列表(numpy+reshape)
2019/11/29 Python
Pycharm 安装 idea VIM插件的图文教程详解
2020/02/21 Python
windows10在visual studio2019下配置使用openCV4.3.0
2020/07/14 Python
魔幻般冒泡背景的CSS3按钮动画
2016/02/27 HTML / CSS
函授毕业生的自我鉴定
2013/11/26 职场文书
应聘英语教师求职信
2014/04/24 职场文书
安全生产标语大全
2014/10/06 职场文书
夫妻分居协议书范文
2014/11/26 职场文书
公务员考察材料
2014/12/23 职场文书
初一军训感言
2015/08/01 职场文书
2016庆祝国庆67周年宣传语
2015/11/25 职场文书
2016年“12.4”法制宣传日活动总结
2016/04/01 职场文书
MySQL 存储过程的优缺点分析
2021/05/20 MySQL
Python实战之OpenCV实现猫脸检测
2021/06/26 Python