Javascript 正则表达式教程详解

发布时间:2020-11-15编辑:脚本学堂
本文介绍下,javascript中正则表达式的全面知识,有理论,有实例,适合初学的朋友参考,当然中等水平的朋友,这篇文章仍然适用。走过路过的莫错过,朋友们。
非捕获分组模式:上面说了捕获分组,那非捕获分组其实就是不让RegExp.$1引用了,这里要说一点的是在捕获分组中RegExp.$1会创建正则的反向引用的存储空间,所以在进行捕获分组时会有更多的空间开销,还会降低匹配速度。那现在晓得非捕获分组的好处了吧。简单的说就是在正则表达式()里面加上一个问号和冒号/(?:first)/,语法就是这样的,还是看代码吧
 

var str = "#123456789";
var reg = /#(?:d+)/;
reg.test(str);
alert(RegExp.$1);      //output "" 注意这里取消了反向引用就为空了

候选模式:候选我的理解就是或者,举个例子,比如你要对一个表达式同时匹配"red", "black"的话怎么做呢, 如果是在以前的话就要写两个正则来进行分别匹配,而加入了候选就可以非常方便的操作了,还是上代码吧。
 

var str1 = "111red222";
var str2 = "111black111";

var reg = /(red|black)/;
alert(reg.test(str2)); //output true
alert(reg.test(str1)); //output true

前瞻模式:有时候我们希望某个字符分组出现在另外一个字符分组之前才去捕获,这相当于是在正则里面做判断了, 果然是高级功能,灰常强大,我在写正则的时候也没有用到过, 只是书上都说了, 我还是把它搬到这里来出哈风头。 上代码吧
 

/*
*前瞻又分为正向前瞻和反向前瞻
 *下面我会用代码加注释的方式加以描述
  */
 //正向前瞻
 var str1 = "bedroom";
  var str2 = "bedding";
 var reg = /(bed(?=room))/; //符号?=来表示正向前瞻,表示在字符串"bedroom"中如果bed后面有room的字符才捕获,顺序执行
 alert(reg.test(str1)); //output true
  alert(RegExp.$1);      //output "bed" 捕获到反向引用bed字符串
  alert(reg.test(str2)); //output true
  //反向前瞻
 var reg = /(bed(?!ing))/; //符号?!来表示反向前瞻,表示在字符串"bedding"中如果有"ing"子字符串才捕获,逆序执行
 alert(reg.test(str2)); //output true
 alert(RegExp.$1);      //output "bed" 捕获到反向引用bed字符串
  alert(reg.test(str1)); //output true
 alert(RegExp.$1);
/*以上代码如果各位亲测试不通过的话那就是正则引擎不支持前瞻*/


边界模式:这个模式很重要也很常用,比如去掉字符串的首尾空格,那下面说说几种边界的可能:
^行的开始           $行的结尾 b单词的边界   B非单词的边界
 

//用一个例子来说明边界
var str = "  xiaoming     "
var reg = /(^s+)|s+$/g; //(^s+)去除字符串开始位置的空格,s+$去除字符串尾部空格,|这个符号想必不用我说了吧,候选
var str = str.replace(reg, "");
alert(str); //output "xiaoming"

多行模式:这个也是正则复杂模式里面最后一个模式了,也不经常用,不管你信不信,反正我是信了,还是直接来看代码吧
 

//请看下面这个实例,n在前面的预定类,表示换行
var str = "firstnsecondnthread";
var reg = /^(w+)/g; 
alert(str.match(reg)); //output 若不指定m行的话就输出"first"
var reg = /^(w+)/gm;
alert(str.match(reg)); //output [first, second, thread]

  到目前为止正则表达式的语法,规则各种都已经说完了,如果各位小白认真的看到这里,我们在来分析文章开头说的邮箱验证表达式就非常容易了。好,现在我们就来一步一步的分析那个非常蛋痛的表达式,首先我们要来拆分这段表达式,我会用不同的颜色来表示这段表达式的每一段,这里就用到了一种思想,分而治之,太复杂的东西不利于直观的表达某些东西,所以拆分,打碎,各个击破:
 

/^([a-zA-Z0-9]+[_|_|.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|_|.]?)*[a-zA-Z0-9]+.[a-zA-Z]{2,3}$/

1.([a-zA-Z0-9]+[_|_|.]?)* 这一段表示的是一个分组,分组()里面首先是[a-zA-Z0-9]意思是匹配字符串大小写字母数字,后面紧跟一个+,这个是贪婪量词,1次到多次,前面提到过的。[a-zA-Z0-9]+而这一段的意思就是说大小写字母数字匹配1次到多次,[_|_|.]?而这个呢是符号"_"或者"."出现0次到一次。整个这段表达式的意思就是所有大小写字母数字出现1次到多次,紧接着符号"_"和"."出现0次到一次,在把这两个条件加起来成为一个组,这个组的格式又可以出现0次到多次。

2.[a-zA-Z0-9]+ 这段就不用说了吧,上面也说了就是大小写字符数字出现1次到多次

3.@([a-zA-Z0-9]+[_|_|.]?)* 这个理解起来就简单了,以字符@开头上面那个分组出现0次到多次的这个格式

4..[a-zA-Z]{2,3}  这个表达式呢还是比较容易,也是以字符"."开头所有大小写字母出现两次或者三次

5./^$/ 这两个符号是表示从字符串的开始匹配到行的结束。

看到这里大家是不是对正则表达式的认识更深了一些呢, 如果还不行话在给大家分析一个实例吧 /^((0?[1-9])|((1|2)[0-9])|30|31)$/ 这个正则的意思是验证一个月的31天,正确格式是01、09和1、31。首先我们还是来拆分 /^((0?[1-9])|((1|2)[0-9])|30|31)$/
1.首先这个表达式中出现了三个黑色的"|"候选符号,意思就是说可以匹配四种情况
2.(0?[1-9]) 这个表达式是匹配 0出现0次或者一次紧接着跟上数字出现一次,这是一种情况,如:01, 09, 1, 9这些
3.((1|2)[0-9]) 这个分组表示的是1或者2出现一次紧接着跟上0-9出现一个,又是一种情况,如:10,19,20,29
4.30|31 这个就更简单了,30或者31只能出现一次。