技术篇之有趣的正则表达式|163

题记

------积极向上的人总是把苦难化为积极向上的动力。

原谅小编最近失踪了一段时间，不过不用担心，小编还是那个最爱你的小编。因为我已经把最好送给了你们。

言归正传，今天小编跟大家一起来学习项目中用的比较频繁的正则表达式。首先我们先用一张图简单了解一下它的基本语法：

不管你是一个前端开发者，还是后台开发者，相信在项目开发中，对于正则已经见怪不怪。所以基本的用法就不在多说，今天主要学习一下它的特殊用法,在JavaScript中的用法，以及一些经常用到的案例。

1.特殊用法

[]的特殊语法

1. -连接符不是第一个字符时[-.]的含义是连字符-或者点符.。但是，如果当连字符不是第一个字符时，比如[a-z]，这就表示是从字母a到字符z。
2. []中的^^在之前介绍中，是表示一行开头，但是在[]中，有着不同的含义。[ab] 表示a或者b[^ab] 啥都行，只要不是a或b(anythings except a and b)，相当于取反

[]和()

除了使用[]表示或逻辑,()也是可以的。用法是(a|b)表示a或者b

比如下面的例子，匹配所有email

gaoyaqi411@126.com
dyumc@google.net
sam@sjtu.edu

思路：

首先要想我到底相匹配什么，这里我想匹配的是

1. 任何一个以words开头的，一个或更多 \w+
2. 紧接着是一个@符号 \w+@
3. 接着有一个或者更多的words \w+@\w+
4. 接着一个.标点 \w+@\w+\.
5. 接着一个com net 或 edu \w+@\w+\.(com|net|edu)

还是提醒注意第四步的\.转义符号

好了，这样几可以匹配以上的所有邮箱了。但是还有一个问题，因为邮箱用户名是可以有.的，比如vincent.ko@126.com

其实仍然很简单，修复如下：[\w.]+@\w+\.(com|net|edu)

2.在JavaScript中的用法

在js中，主要的正则表达式都是涉及到string的应用。

var str = "hello"var r = /w+/

这两个分别是string和reg的字面量创建方法。当要使用正则来进行操作的时候，使用了r.test()和str.match() 以及str.replace等方法。

reg.test()

正则表达式本身有一个test的方法，这个方法只能测试是否包含，返回一个bool变量。

var r = /\d{3}/; var a = '123'; var b = '123ABC'; var c = 'abc'; r.test(a) //truer.test(b) //truer.test(c) //false

嗯，这个很简单，而且用的实际不多，下面着重讲str上的一些方法。

str.match()

与test()不同，不只是返回bool变量，它会返回你所匹配到的内容。

var r = /compus/var reg = /w+/var s = "compus, I know something about you"r.test(s) //trues.match(r) //["compus"]s.match(reg) //["compus"]复制代码

等等，好像有点问题，为什么最后一个返回的也是"compus"？这不科学。

好吧，实际上，match()返回了第一个可以匹配的序列。想要实现之前的效果，就要用到JS里关于正则的几个flag

flag

这个标志就在建立正则的时候就要有的，主要有三个

flag

含义

全部的，给我匹配全部的

忽略大小写

多行匹配

所以为了解决刚才的问题，只要这样子设置reg就可以了

var reg = /w+/g

所以结论是：当使用了全局flagg的时候，不会返回分组，而是全部的匹配结果；如果没有使用g，会将匹配到的结果和分组以数组的形式返回。

那么如何实现全局的分组？

reg.exec()

从字面意思来看，正则表达式的执行方法。这个方法可以实现匹配全局，并返回分组的结果。

reg.exec()每次调用，返回一个匹配的结果，匹配结果和分组以数组的形式返回，不断的调用即可返回下一个结果，直到返回null

var str = "Here is a Phone Number 111-2313 and 133-2311" ;var srg = /(\d{3}) [-.]\d{4}/g;var result = srg.exec(str);while(result !== null) { console.log(result); result = srg.exec(str); }

result包含的内容可能比想象中的多，它是一个数组，比如第一次执行，他的结果为：

["133-2311", "133", index: 36, input: "Here is a Phone Number 111-2313 and 133-2311" groups: undefined]

str.split

现在来到了更强的功能上，先说下split，我们知道split是将字符串按照某个字符分隔开，比如有以下一段话，需要将其分割成单词。

var s = "unicorns and rainbows And, Cupcakes"

分割成单词，首先想到的是空格隔开，于是可以用下面方式实现

var result = s.split(' ');var result1 = s.split(/\s/);//完全一样的效果// ["unicorns", "and", "rainbows", "And,", "Cupcakes"]

嗯，这样体现不出来正则的强大，而且最主要的是没有实现要求。因为还有一个"And,"。所以要用正则了，匹配条件是逗号或者空格

result = s.split(/[,\s]/);//["unicorns", "and", "rainbows", "And", "", "Cupcakes"]

结果仍然和需要的有出入，因为多了一个""。我们并不是想让它分割的依据是逗号或者空格,依据应该是逗号或空格所在的连续序列。在原来的基础上加一个+，改成/[,\s]+/，这个含义就是一个单独的逗号，或者一个单独的空格

result = s.split(/[,\s]+/);// ["unicorns", "and", "rainbows", "And", "Cupcakes"]

单词分割

好了，拓展一下，实现一个段落的单词分割，一个正则表达式就是

result = s.split(/[,.!?\s]+/)复制代码

当然，有个最简单的方法，我们可以这样去做

result = s.split(/\W+/);复制代码

接着，如果我们想将一个段落的句子都分隔开，一个可以实现的表达式就是

result = s.split(/[.,!?]+/)复制代码

最后，有一个小需求，就是在分割句子的同时，还想把相应的分隔符保留下来。

var s = "Hello,My name is Vincent. Nice to Meet you!What's your name? Haha."复制代码

这是一个小小的ponit，记住如果想要保留分隔符，只要给匹配的内容分组即可

var result = s.split(/([.,!?]+)/)//["Hello", ",", "My name is Vincent", ".", " Nice to Meet you", "!", "What's your name", "?", " Haha", ".", ""]

可以看到，这样就会把分隔符也存储起来。

str.replace()

replace也是字符串的方法，它的基本用法是str.replace(reg,replace|function)，第一个参数是正则表达式，代表匹配的内容，第二个参数是替换的字符串或者一个回掉函数。

注意，replace不会修改原字符串，只是返回一个修改后的字符串;除此外，正则表达式如果没有使用g标志，也和match一样，只匹配/替换第一个

最简单的替换

替换一个序列中的元音字母(aeiou)，将其替换成一个double。比如x->xx

var s = "Hello,My name is Vincent."var result = s.replace(/([aeiou])/g,"$1$1") //"Heelloo,My naamee iis Viinceent."

注意，第二个参数必须是字符串; 注意不要忘记加g

牛x哄哄的function参数来了

嗯，这才是最强大的地方，第二参数传入function，先看一个最简单的示例

var s = "Hello,My name is Vincent. What is your name?" var newStr = s.replace(/\b\w{4}\b/g,replacer)console.log(newStr) function replacer(match) { console.log(match); return match.toUpperCase();

所以，函数的参数是匹配到的内容，返回的是需要替换的内容。好了，基本示例解释了基本用法，那么之前讨论的分组怎么办？如何实现分组呢？

//分组function replacer(match,group1,group2) { console.log(group1); console.log(group2); }

如果正则表达式分组处理，那么在回调函数中，函数的第二个、第三参数就是group1,group2。这样子，就可以做很多神奇的事情

3.正则案例

验证用户密码:^[a-zA-Z]\w{5,17}$ 正确格式为：以字母开头，长度在6-18之间，只能包含字符、数字和下划线。

域名：[a-zA-Z0-9][-a-zA-Z0-9]{0,62}(/.[a-zA-Z0-9][-a-zA-Z0-9]{0,62})+/.?

验证汉字：^[\u4e00-\u9fa5],{0,}$

验证Email地址：^\w+[-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$

验证InternetURL：^http://([\w-]+\.)+[\w-]+(/[\w-./?%&=]*)?$ ；^[a-zA-z]+://(w+(-w+)*)(.(w+(-w+)*))*(?S*)?$

手机号码：^(13[0-9]|14[5|7]|15[0|1|2|3|5|6|7|8|9]|18[0|1|2|3|5|6|7|8|9])\d{8}$

国内电话号码：(0511-4405222、021-87888822)：\d{3}-\d{8}|\d{4}-\d{7}

验证身份证号：（15位或18位数字）：^\d{15}|\d{}18$