js 正则表达式/g对exec()测试结果的影响
来源:互联网 发布:行政区域数据 编辑:程序博客网 时间:2024/06/10 09:47
遇到一个bug,代码的执行完全不在期望之内。
我写了一段这样的代码,实现的功能,就想实现一个简单的jquery选择器功能。
function $(selector){ var ID_REG=/^\#(\w*)$/g; var CLASS_REG=/^\.(\w*)$/g; if(ID_REG.test(selector)){ var tempt_result=ID_REG.exec(selector); return document.getElementById(tempt_result[0]); }else if(CLASS_REG.test(selector)){ var tempt_result=CLASS_REG.exec(selector); return document.getElementByClass(tempt_result[0]); }else{ return null; } } console.log($("#images")); console.log($(".images"));
按常理,我先test一下选择器是否和正则匹配,如果匹配,我就通过exec去提取id或者class。但是我多次测试的tempt_result这个变量始终为空。
后来发现问题存在于正则是在全局模式下进行匹配的,并且问题就出来。
在js中每个正则表达式都是一个对象,这个对象有一个特别的实例属性lastIndex,表示的是下一次搜索开始的位置。在《js高级程序设计》这本书中提到,
对于exec()方法而言,在全局模式下,它每次执行都只会返回一个匹配项,并且会改变lastIndex的值,再次执行的时候,会从lastIndex这个位置开始继续搜索。但是对于非全局模式,exec每次都只会返回第一个匹配的信息,lastIndex也不会变化。
书中只提了exec方法,却没有提test方法对lastIndex属性的影响,其实test在全局模式下,也会影响到lastIndex的值。
在上面的示例中,我首先使用了test方法来匹配,执行完之后,由于是整个串都匹配,所以ID_REG的lastIndex就是selector(『#images』)的length=7,当再执行exec的时候,由于从7开始没有匹配的串,所以tempt_result 就是null,此时的lastIndex就是0。
找到原因之后,就很好解决了,去掉全局模式,同时也提醒不要滥用正则的全局模式
,既然匹配的是整个串(^$就分别匹配的是字符串的开头和结尾),那么就不需要全局模式。
=======================更新2016-12-27==================
html5 中新增了 document.querySelector(selector),document.querySelectorAll(selector)两个方法,其中的selector语法和jquery的选择器语法一样,前一个方法返回匹配的第一个元素,后一个方法返回的是匹配的全部元素,是一个类似数组。
- js 正则表达式/g对exec()测试结果的影响
- JS 正则表达式 exec
- js正则表达式 match exec test,以及g模式的一些知识点
- javascript 正则表达式 exec /g 多次循环
- javascript 正则表达式 exec /g 死循环
- JS 中 正则表达式 match test exec的区别
- JS正则表达式及exec和match的区别
- js的正则表达式 test, exec, match, replace
- JS正则表达式exec()与String.prototype.match()的差异
- 集合点插入位置不同对测试结果的影响
- 在Loadrunner缓存中对测试结果的影响
- 正则表达式的exec()方法
- AS3和js 正则表达式exec()用法
- js正则表达式之exec方法讲解
- 测试过的JS正则表达式
- js两次一样的正则表达式,结果却不同
- 关于js对页面加载影响的测试
- 关于js正则表达式g,i,m 参数的总结
- window.location.hash详解
- 视频网络协议
- poj1047 数论
- 字体问题
- select自定义属性值
- js 正则表达式/g对exec()测试结果的影响
- ZOJ 2417 Lowest Bit
- Code Forces 645C Enduring Exodus
- Gson之手动方式
- 基于FileReader实现的图片网页本地浏览
- sql server 修改表架构
- 从头认识多线程-目录
- 【Java线程】锁机制:synchronized、Lock、Condition
- Scrapy环境的搭建与入门教程