开发项目的过程中，用了很多的正则表达式，可是每一次都不是自己写的，遇到正则表达式的地方，要么去求助度娘，要么就是组长给写好的，我直接贴过来然后用的。感觉真是有一种码奴的感觉。这种感觉那是相当不好的。
所以，趁着最近有时间，赶紧的把正则表达式这块赶紧的补起来。
1. waht?
正则表达式到底是什么鬼？
Regular Expression，又称为规则表达式，计算机科学的一个概念。正则表达式通常用来被检索、替换那些符合某个模式（规则）的文本。
--度娘
在编写处理字符串的程序或网页时，经常会有查找符合某些复杂规则的字符串的需要。正则表达式就是用于描述这些规则的工具。换句话说，正则表达式就是记录文本规则的代码。
--推荐网站
2. why?
我们为什么要使用正则表达式？
相信有过一段时间开发经验的童鞋们，或多或少的都会处理过一些字符串的替换或者查找之类的，如何自己写查找的代码，不仅费时费力，而且还会有漏洞，使用正则表达式，不仅可以减少代码量还可以简化代码，简直就是程序猿 or 程序媛的救世主。(づ￣ 3￣)づ
3. how?
那么我们该如何学习？
学习正则表达式的最好的办法就是实际的进行操作，只有一边写代码一边实践才能够学习。首先跟着例子，理解例子，然后再将例子进行修改，转化为自己的知识，这样才能融会贯通。
我们来看第一个例子。
- 匹配一个字符串hi
在浏览器中执行是这样的：
>str
<"Hi,hehe.I like you,do you like me? Oh,I know what you think. Let me quietly okay?"
>str.replace(/hi/, '你好');
<"Hi,hehe.I like you,do you like me? Oh,I know what you t你好nk. Let me quietly okay?"
这是最简单的正则表达式了，它可以精确匹配这样的字符串：由两个字符组成，前一个字符是h,后一个是i。通常，处理正则表达式的工具会提供一个忽略大小写的选项，如果选中了这个选项，它可以匹配hi,HI,Hi,hI。
- 精确查找
hi这个单词
/\bhi\b/
在浏览器中执行
>str = "Hi,hehe. hi, I like you,do you like me? Oh,I know what you think. Let me quietly okay?";
<"Hi,hehe. hi, I like you,do you like me? Oh,I know what you think. Let me quietly okay?"
>str.replace(/\bhi\b/, '你好');
<"Hi,hehe. 你好, I like you,do you like me? Oh,I know what you think. Let me quietly okay?"
\b是正则表达式规定的一个特殊代码，代表着单词的开头或结尾。虽然通常英文的单词是由空格或标点符号或换行为分隔的，但是\b并不代表这些单词分隔符中的任何一个，只代表一个位置。
- 假如你要查询，
hi后面紧跟着的hehe
/\bhi\b.*\bhehe/
在浏览器中执行的结果
>str
<"Hi,hehe. hi hehe,hi Hehe. I like you,do you like me? Oh,I know what you think. Let me quietly okay?"
>str.replace(/\bhi\b.*Hehe/, '你好');
>"Hi,hehe. 你好. I like you,do you like me? Oh,I know what you think. Let me quietly okay?"
这里，
.是另一个特殊代码，代表除了换行符以外的任意字符。*同样是特殊的代码，不过它代表的不是字符，也不是位置，而是数量--它指定前边的内容可以重复任意次以使整个表达式得到匹配。因此，.*连在一起就意味着任意数量的不包含换行的字符*。现在\bhi\b.*Hehe的意思就很明显了：先是一个单词hi,然后是任意个任意字符(但不能是换行)，最后是Hehe这个单词。
-
.代表除了换行符以外的任意字符。
在浏览器中执行
>ss = "hi, hehe. hi,hehe";
<"hi, hehe. hi,hehe"
>ss.replace(/hi\b...hehe/, '你好');
>"你好. hi,hehe"
匹配了3个空格。
- \d代表任意数字
\d是一个新的特殊代码，代表任意的数字(0，或1，或2，或。。。)。
匹配手机号码
>num = "038-3735260";
<"038-3735260"
>num.replace(/0\d\d-\d{7}/, '电话号码');
<"电话号码"
为了避免那么多烦人的重复，我们也可以这样写这个表达式：0\d{2}-\d{8}
这里\d后面的{2}({8})指定的是前面\d必须连续重复出现2次(8次)。
特殊字符
现在你已经知道几个具有特殊意义的代码了，如
\b,.,*，还有\d.事实上还有更多的特殊代码，比如\s代表任意的空白符，包括空格，制表符(Tab),换行符。\w代表着字母或数字。
下面来试试更多的例子：
\ba\w*\b匹配以字母a开头的单词-先是某个单词开始处(\b)，然后是字母a,然后是任意数量的字母或数字(\w)，最后是单词结束处(\b)。
\d+匹配1个或更多连续的数字。这里的+是和类似的特殊代码，不同的是*代表重复任意次(可能是0次)，而+则代表重复1次或更多次。
\b\w{6}\b匹配刚好6个字母/数字的单词。
常用的特殊符号表格
-
.匹配除换行符意外的任意字符 -
\w匹配字母或数字 -
\s匹配任意的空白符 -
\d匹配数字 -
\b匹配单词的开始或结束 -
^匹配字符串的开始 -
$匹配字符串的结束 -
*同样是特殊的代码，不过它代表的不是字符，也不是位置，而是数量--它指定*前边的内容可以重复任意次以使整个表达式得到匹配。
例子
- 比如一个网站如果要求你填写的QQ号必须为5位到12位数字时，可以使用：^\d{5,12}$。
>num = "863952988";
<"863952988"
>num.replace(/^\d{5,12}$/,'贺贺');
<"贺贺"
这里的{5,12}和前面介绍过的{2}是类似的，只不过{2}代表只能不多不少重复2次，{5,12}则是必须重复最少5次，最多12次，否则都不匹配。
字符转义
如果你想查找特殊代码本身的话，比如你查找.,或者*,就出现了问题：你没法指定它们，因为它们会被解释成其它的意思。这时你就必须使用\来取消这些字符的特殊意义。因此，你应该使用\.和\*。当然，要查找\本身，你也得用\\.
重复
正则表达式中指定的重复的一些方式。
-
*代表重复零次或更多次 -
+代表重复一次或者更多次 -
?代表重复零次或一次 -
{n}代表重复N次 -
{n,}代表重复N次或更多次 -
{n,m}代表重复N到M次
在浏览器中执行
>num = "23ddd455";
<"23ddd455"
>num.replace(/\d?/,'贺贺');
<"贺贺3ddd455"
>num.replace(/\d*/,'贺贺');
<"贺贺ddd455"
>num.replace(/\d*/g,'贺贺');
<"贺贺贺贺d贺贺d贺贺d贺贺贺贺"
字符类
我们想要匹配字符，需要我们自定义的来写，比如想要匹配aeiou等元音字母，只需要[aeiou]就可以了。
我们也可以轻松地指定一个字符范围，像[0-9]代表的含意与\d就是完全一致的：一位数字，同理[a-z0-9A-Z]也完全等同于\w。
浏览器中执行
>num = "23ader567gh";
<"23ader567gh"
>num.replace(/[aeh]/,'贺贺');
<"23贺贺der567gh"
>num.replace(/[aeh]/g,'贺贺');
<"23贺贺d贺贺r567g贺贺"
反义
有时需要查找不属于某个简单定义的字符类的字符。比如想查找除了数字以外，其它任意字符都行的情况，这时需要用到反义。
-
\W匹配任何不是字母和数字的字符。 -
\S匹配任意不是空白符的字符。 -
\D匹配任意非数字的字符 -
\B匹配不是单词开头或结束的位置。 -
[^x]匹配除了X以外的任意字符。 -
[^aeiou]匹配除了aeiou以外的其他字符
例如：
<a\[\^>]+> 代表用尖括号括起来的以a开头的字符串。
浏览器中执行
>var str = '啦啦啦<aheh><.e><input class="eds">';
>str.match(/<a[^>]+>/g);
<["<aheh>"]
替换
正则表达式中的替换指的是，有几种规则，如果满足其中任意一种规则则要进行替换。
具体方法是用|把不同的规则分隔开。
eg1:三位区号或者四位区号的八位电话号码。
>num
<"002-12345,0023-1234"
>num.match(/0\d{2}-\d{5}|0\d{3}-\d{4}/g);
<["002-12345", "0023-1234"]
eg2:各种规则不同的匹配
>num="002-12345,00912345,038-123-46";
<"002-12345,00912345,038-123-46"
>num.match(/0\d{2}[-]?\d{3}[-]?\d{2}/g);
<["002-12345", "00912345", "038-123-46"]
分组
我们已经涉及到了如何重复单子字符，那么接下来我们就要尝试一下如何重复一个字符串？
你可以<u>使用小括号来指定子表达式（也叫作分组）</u>，然后你就可以指定这个子表达式的重复次数了。当然你也可以进行一些其他的操作，后续将会继续学习。
分组共分为4种：
-
捕获型
每个捕获型分组被指定了一个数字。 -
非捕获型 -
?: -
向前正向匹配 -
?= -
向前负向匹配
?!
下面我们来分析例子：
eg1：
(\d{1,3}\.){3}\d{1,3}
-----------------------------
\d{1,3} 代表1到3位的数字
(\d{1,3}\.}{3} 代表三位数字加上一个英文句号(这个整体也就是这个分组)重复3次.
最后再加上一个一到三位的数字(\d{1,3})
eg2：
说明几点简单用法：
[01] ： 表示[]中的某一个；
[0-4]: 表示0至4中的任意一个；
2[0-4]\d: 表示以2开头，第二位是0至4的任意一个，第三位任意数字；
2[0-4]\d|25[0-5]|[01]?\d\d?：表示IP地址的一节，最大是255
正确的IP地址：((2[0-4]\d|25[0-5]|[01]?\d\d?)\.){3}(2[0-4]\d|25[0-5]|[01]?\d\d?)
JavaScript语言精粹中的正则表达式 - 学习
1. 正则表达式标识
| 标识 | 含义 |
|---|---|
| g | 全局的（匹配多次；不同的方法对g标识的处理各不相同） |
| i | 大小写不敏感（忽略字符大小写） |
| m | 多行（^ 和 $ 能匹配行结束符） |
使用RegExp创建正则表达式要注意：RegExp接收的是字符串，所以对反斜杠的处理要特别注意。
> var my_regexp = new RegExp("\"(?:\\\\.|[^\\\\\\\"])*\"");
> my_regexp
< /"(?:\\.|[^\\\"])*"/
2. 元素
2.1 正则表达式分支
一个正则表达式分支包含一个或多个正则表达式序列。
"into".match(/in|int/); // 会匹配`in`，不会再匹配`int`
2.2 正则表达式量词
正则表达式因子（一个正则表达式因子可以是一个字符、一个由圆括号包围的组、一个字符集或者是一个专一序列）可以用一个正则表达式量词后缀来决定这个因子应该被匹配的次数。
包围在一对花括号中的一个数字表示这个因子应该被匹配的次数。所以，/www/的匹配和/w{3}/一样，{3,6}会匹配3，4，5或6次，{3，}会匹配3次或者更多次。
?等同于{0，1}，*等同于{0,}，+等同于{1，}。
写在后面
GitHub上集大家之力搞了一个前端面试题的项目，里面都是大家面试时所遇到的题以及一些学习资料，有兴趣的话可以关注一下。如果你也有兴趣加入我们的话，请在项目中留言。项目同时也可以在gitbook上查看。
网友评论