今天一大早遇就遇到一件诡异的事儿,可能是思绪还没有澄静下来,一下子没反应过来。事情是这样的:

模板:

<input class="name" type="text" placeholder="username">
<button type="submit">submit</button>

脚本:

$("button").click(function(event) {
event.preventDefault();
var $name = $(".name").val();
// 用户名:以数字、字母或下划线开头,有6-20位
var reg_name = /^[a-zA-Z0-9_]{1}[a-zA-Z0-9\*\._]{5,19}$/g;
console.log(reg_name.test($name)); 
if (reg_name.test($name)) {      
   console.log("correct!");
   } else {
  console.log("error!");        
   }
});

输出:

true
error!

我在输入框内填入“qqqqqq”,提交,我瞬间懵了,这这这,返回true了,你还给我走false分支?!此事必有蹊跷。。。待我inner peace了一下之后,稍作调整,代码正常了:

脚本:

$("button").click(function(event) {
event.preventDefault();
var $name = $(".name").val();
// 用户名:以数字、字母或下划线开头,有6-20位
var reg_name = /^[a-zA-Z0-9_]{1}[a-zA-Z0-9\*\._]{5,19}$/;
console.log(reg_name.test($name));
if (reg_name.test($name)) {
console.log("correct!");
} else {
console.log("error!");
}
});

输出:

true
correct!

我把正则表达式对象后边的“g”修饰符给去掉之后,代码可正常运转。话说这个“g”的意思是:执行一个全局匹配,也即找到目标字符串中所有与表达式匹配的字符。而每一次执行exec(),只要一匹配到符合条件的字符,这个方法就立马返回匹配的对象,它又是如何找到所有匹配的字符呢?这又牵扯到RegExp对象的lastIndex属性,这个属性返回的是与匹配的字符紧邻的位置,也即第一个不与表达式匹配的字符的位置。这样,我们来个栗子:

脚本:

var str = "cat, fat, bat, pat";
var reg = /.al/g;
var match = reg.exec(str);
console.log(match + ": " + match.index + "," + match[0] + "," + reg.lastIndex);
match = reg.exec(str);
console.log(match + ": " + match.index + "," + match[0] + "," + reg.lastIndex);

输出:

cat: 0,cat,3
fat: 5,fat,8

上述代码,我们可以看到,我对该字符串执行了两次exec()方法,第一次,它匹配到了“cat”字符,lastIndex指的就是第一个“,”所在的位置,也即3,第二次,匹配到了“fat”字符,此时lastIndex指的就是第二个“,”所在的位置,也即8,lastIndex就像一个书签,它记录着每一次匹配进行的位置。我们来换一个方式,看“g”修饰符如何尽情施展拳脚:

脚本:

var str = "cat, fat, bat, pat";
var reg = /.at/g;
while((matche = reg.exec(str)) != null) {
console.log(matche + "," + matche.index + "," + matche[0] + "," + reg.lastIndex);
}

输出:

cat,0,cat,3
fat,5,fat,8
bat,10,bat,13
pat,15,pat,18

喏,所有字符都如愿以偿的被匹配了,这就是“g”和“lastIndex”的强大之处。当然,我也知道了上述的诡异问题还有一个问题就是我对该字符串进行了两次匹配,之前只知道test()方法返回布尔值,exec()方法返回匹配的结果,感觉test()只是一把小刀,功能并没有exec()强大,查了一下资料才发现并不然。

原话是这么说的:“其实,调用test()和调用exec()是等价的,当exec()返回的结果不是null时,test()返回true,由于这种等价性,当一个全局正则表达式调用test()方法时,它的行为和exec()相同,因为它从lastIndex指定的位置开始检索某个字符,如果找到了一个匹配结果,就立刻设置lastIndex的值为当前匹配子串的结束位置,这样一来,就可以使用test()方法来遍历字符串,就像使用exec()一样。”(《权威指南》)

因此,我们在写正则的时候,一定要注意修饰符及方法的使用,若使用不当,势必会对下次匹配造成不确定的影响,同时也要记得,不要在正则表达式里加入空格,这同样会对结果有影响。

最后再附几个常用的正则:

// 用户名:以数字、字母或下划线开头,有6-20位
var reg_name = /^[a-zA-Z0-9_]{1}[a-zA-Z0-9\*\._]{5 , 19}$/;
// 密码:只能输入6~20位的数字、字母、下划线、*
var reg_pwd = /^[\w\*]{6,20}$/;
// 手机号:可以以+或数字开头,也可以含有“—”和“ ”
var reg_phone = /^[+]?(\d){3}[\s|-]?(\d){4}[\s|-]?(\d){4}$/;
//时间:年月日---   2016-01-20   16-02-02  20160202
var reg_time = /^\d{2}|\d{4}[-]?((0([1-9]{1}))|1[1|2])[-]?((0[1-9])|[1|2]\d)|(3|[0|1])$/;
// 邮箱:***@**.***

function isEmail (theStr) {
  var atIndex = theStr.indexOf('@');
  var dotIndex = theStr.indexOf('.', atIndex);
  var flag = true;
  theSub = theStr.substring(0, dotIndex+1)

  if ((atIndex < 1)||(atIndex != theStr.lastIndexOf('@'))||(dotIndex < atIndex + 2)||(theStr.length <= theSub.length)) {

    return(false);

  }else {

    return(true);

  }
}

【原】无规矩,不方圆——说一说正则里的exec()和test()的更多相关文章

  1. 无规矩不成方圆,聊一聊 Spring Boot 中 RESTful 接口设计规范

    在设计接口时,有很多因素要考虑,如接口的业务定位,接口的安全性,接口的可扩展性.接口的稳定性.接口的跨域性.接口的协议规则.接口的路径规则.接口单一原则.接口过滤和接口组合等诸多因素,本篇文章将简要分 ...

  2. JUC之原子类

    在分析原子类之前,先来了解CAS操作 CAS CAS,compare and swap的缩写,中文翻译成比较并交换. CAS 操作包含三个操作数 —— 内存位置(V).预期原值(A)和新值(B).如果 ...

  3. 无阻塞加载和defer、async

    无阻塞加载 把js放在head里,浏览器是怎么去执行它的呢,是按顺序加载还是并行加载呢?在旧的浏览器下,都是按照先后顺序来加载的,这就保证了加载的js依赖不会发生问题.但是少部分新的浏览器已经开始允许 ...

  4. C# .net WPF无边框移动窗体

    转自 http://download.csdn.net/detail/xiang348352/3095084 WPF无边框移动窗体,先在<Window>里添加 MouseLeftButto ...

  5. WPF无边框移动窗体

    WPF无边框移动窗体,先在<Window>里添加 MouseLeftButtonDown=”Window_MouseLeftButtonDown” 然后导航到事件,在事件里添加 if (e ...

  6. JUC 中的 Atomic 原子类总结

    1 Atomic 原子类介绍 Atomic 翻译成中文是原子的意思.在化学上,我们知道原子是构成一般物质的最小单位,在化学反应中是不可分割的.在我们这里 Atomic 是指一个操作是不可中断的.即使是 ...

  7. 基于OAuth2.0的token无感知刷新

    目前手头的vue项目关于权限一块有一个需求,其实架构师很早就要求我做了,但是由于这个紧急程度不是很高,最近临近项目上线,我才想起,于是赶紧补上这个功能.这个项目是基于OAuth2.0认证,需要在每个请 ...

  8. python 爬取腾讯微博并生成词云

    本文以延参法师的腾讯微博为例进行爬取并分析 ,话不多说 直接附上源代码.其中有比较详细的注释. 需要用到的包有 BeautifulSoup WordCloud jieba # coding:utf-8 ...

  9. UED团队规范设计参考及建议

    公司产品线逐渐增多,变动频繁且并行开发,常常需要设计与开发能够快速的做出响应.同时这类产品中有存在很多类似的页面以及组件,可以通过抽象得到一些稳定且高复用性的内容.通过模块化的解决方案,降低冗余的生产 ...

随机推荐

  1. R语言-基本图形

    barplot() 条形图 spine() 棘状图 pie() 饼图 hist() 直方图 plot(density(x))核密度图 boxplot(X) 箱线图 vioplot() 小提琴图 dot ...

  2. TP中的session和cookie

    session:1.session('name','value');  //设置session2.$value = session('name');  // 获取所有的session 3.2.2版本新 ...

  3. X.509证书生成

    创建数字证书 用户对数字证书的认可决定于对证书颁发机构的信任,所以证书颁发机构决定了数字证书的可用范围.由于官方认可的数字证书颁发机构,比如VeriSign.Thawte(OpenSSL),具有普遍的 ...

  4. DbEntry.Net.v3.5 快速教程

    1.DbEntry 介绍 EN&Download——[DbEntry Framework下载][Tutorials For Version 3.5] CN&Summary:总体特性的介 ...

  5. 支持ASP.NET WebService

    ASP.NET WebService默认返回的数据格式是XML,但也能返回JSON格式. 如何让MiniUI组件支持ASP.NET WebService? 只需要: 1) 引用miniui-webse ...

  6. 深入研究js构造函数和原型

    很快就要从新浪离职了,最近心情比较轻松,抽点空整理一下构造函数和原型的机理. 我们都知道,在经典设计模式中我们最常用的就是工厂模式.构造函数模式.原型模式这几种,听起来‘模式’好像很高大上的样子,实际 ...

  7. Eclipse 复制代码保留原格式

    当代码中有折叠代码时,无法复制格式,觉得方法有2: 1.设置取消折叠 如图所示,取消勾选"Enable folding"即可,该方法一劳永逸,缺点是以后编码显示不够简洁. 2.点开 ...

  8. 1、B2BUA

    链接1:proxy和B2BUA的区别和联系:http://www.cnblogs.com/gnuhpc/archive/2012/12/11/2813499.html 链接2:http://blog. ...

  9. 批量删除wps文档里的回车符的方法!WPS使用技巧分享!

    有时候整理文档的时候,如果是从网上复制的文字,可能会因为复制而产生很多的回车符.怎样能批量去掉这些个回车符呢,下面马上告诉你批量删除wps文档里的回车符的方法!WPS使用技巧分享! 想要批量删除批量删 ...

  10. iPad 控件UIPopoverController使用

    UIPopoverController 是iPad特有控件,(iOS7-9),在iOS9之后别废弃 使用步骤 设置内容控制器 UIPopoverController直接继承NSObject,不具备可视 ...