HTML5学堂-码匠 HTML5学堂

您当前位于:面试题精讲 ——> WEB前端面试真题 - test方法是什么,如何使用(正则方法)

WEB前端面试真题 - test方法是什么,如何使用(正则方法)

2015/07/08 08:53:00 | 作者:HTML5学堂(码匠) | 分类:面试题精讲 | 关键词:前端,面试题,test方法,正则

正则test等方法面试题精讲

HTML5学堂:前一段时间,自己的学生问了自己一个面试问题,是关于正则表达式的test方法的,检测某一正则规则是否能够匹配字符串。如果不是这个学生问自己,自己也没有注意到这个方法(包括exec方法)的特殊性,因此书写出来大家分享一下吧~

关于正则的test方法

题干:如下代码,输出的值是多少?

  1. var reg = /h5course/gi;
  2. var str = 'h5coursedefg';
  3. var str2 = 'h5coursedefg';
  4. console.log(reg.test(str));
  5. console.log(reg.test(str2));

答案是什么呢?很明显需要匹配的两个str是一样的,都要查找是否有abc这样的内容,于是,结果原则上说,应该是true true啊~~~可是,答案偏偏不是这个,打印出来的结果是——true false。

在讲解原理之前,大家可以尝试在控制台输出这两段代码:

代码段1

  1. var reg = /h5course/gi;
  2. var str = 'h5coursedefgh5course';
  3. var str2 = 'h5coursedefgh5course';
  4. console.log(reg.test(str));
  5. console.log(reg.test(str2));

代码段2

  1. var reg = /h5course/i;
  2. var str = 'h5coursedefg';
  3. var str2 = 'h5coursedefg';
  4. console.log(reg.test(str));
  5. console.log(reg.test(str2));

基本原理

每个正则表达式都有一个 lastIndex属性,用于记录上一次匹配结束的位置。在设置全局状态时,下一次的查找会从前一次的lastIndex开始。换句话说,使用“h5course”去匹配“h5coursedefg”,首先匹配到了,那么此时lastIndex为8,第二次进行匹配的时候,就从索引值8开始进行,后面当然就没有了

解决方法

解决这种问题的方法有两种,一种是将lastIndex属性值置0,另一种就是去掉g(即不在全局状态下进行查找)。

关于上面代码段1,其实并没有解决这个问题,第一次str匹配到的是第一个h5course,第二次匹配的时候,实际上匹配到的是fg后面的h5course。

关于lastIndex的值的设置,通过设置之后则可调整正常。

  1. var reg = /h5course/gi;
  2. var str = 'h5coursedefg';
  3. var str2 = 'h5coursedefg';
  4. console.log(reg.test(str));
  5. reg.lastIndex = 0;
  6. console.log(reg.test(str2));

欢迎沟通交流~HTML5学堂

微信公众号,HTML5学堂,码匠,原创文章,WEB前端,技术分享

HTML5学堂

原创前端技术分享

HTML5学堂,HTML5,WEB,前端,视频课程,技术视频,学习视频,面试,JS

原创视频课程

用心打造精品课程

微信小程序,决胜前端,面试题,面试题集合,前端,HTML5,真题

小程序-决胜前端

前端面试题宝库

原创书籍,学习书籍,书籍推荐,HTML5布局之路,HTML5,WEB前端

HTML5布局之路

非传统模式讲解前端

iOS,APP,码集,案例交互,JavaScript学习,WEB前端,HTML5

iOS APP 码集

案例交互式学习JS