tags: 正则表达式
categories: JavaScript
欢迎点击我的博客原文

前端会遇到很多字符串验证问题，正则表达式是一个强大的字符串匹配工具，今天就来总结一下正则表达式。

（一）工具

Regexper：正则表达式可视化工具，看不懂的表达式放进去，帮助理解

（二）理论部分

一、正则表达式简介

正则表达式是一个强大的字符串匹配工具。

1.匹配模式标志flags

3 个匹配模式标志flags：标明正则表达式的行为

一个正则表达式就是一个模式与3 个标志的组合体

var pattern1 = /at/g; // 匹配字符串中所有"at"的实例
var pattern2 = /[bc]at/i; // 匹配第一个"bat"或"cat"，不区分大小写
var pattern3 = /.at/gi; // 匹配所有以"at"结尾的3 个字符的组合，不区分大小写

2.元字符

与其他语言中的正则表达式类似，匹配字符串中的元字符必须转义。

正则表达式中的元字符包括：( [ { \ ^ $ | ) ? * + . ] }

var pattern1 = /[bc]at/i; // 匹配第一个"bat"或"cat"，不区分大小写
var pattern2 = /\[bc\]at/i; // 匹配第一个" [bc]at"，不区分大小写
var pattern3 = /.at/gi; // 匹配所有以"at"结尾的3 个字符的组合，不区分大小写
var pattern4 = /\.at/gi; // 匹配所有".at"，不区分大小写

3.创建正则表达式

有两种方法，这两种方法完全等价。

<法一> 对象字面量

• 正则表达式放在一对斜杠（/）之间

var expression = / pattern / flags ;

<法二> 使用RegExp()构造函数

• 2个参数（均为字符串）：要匹配的字符串模式pattern，（可选）匹配模式标志flags

var pattern1 = /[bc]at/i; // 匹配第一个"bat"或"cat"，不区分大小写
var pattern2 = new RegExp("[bc]at", "i"); // 与pattern1 相同，只不过是使用构造函数创建的

注意！

1. 传递给RegExp 构造函数的2个参数都是字符串（不能把正则表达式字面量传递给RegExp 构造函数）
2. 由于RegExp 构造函数的模式参数是字符串，所以在某些情况下要对字符进行双重转义：

• 所有元字符
• 已经转义过的字符，例如：\n（字符\：在字符串中转义\\，在正则表达式字符串中双重转义\\\\）

字面量模式 | 等价的字符串 |
----|------|----
/\[bc\]at/ | "\\[bc\\]at"
/\.at/ | "\\.at"
/name\/age/ | "name\\/age"
/\d.\d{1,2}/ | "\\d.\\d{1,2}"
/\w\\hello\\123/ | "\\w\\\\hello\\\\123"

二、RegExp类型

EMCAScript通过RegExp类型来支持正则表达式。

    var reg = new RegExp("\\d{5}","g");//匹配全局模式下的5个数字
    alert(reg.test("1J2a35786"));//true
    alert(reg.test("1J2a356"));//false

局限性

要了解更多相关信息，请访问www.regular-expressions.info

尽管ECMAScript 中的正则表达式功能还是比较完备的，但仍然缺少某些语言（特别是Perl）所支
持的高级正则表达式特性。下面列出了ECMAScript 正则表达式不支持的特性:

• 匹配字符串开始和结尾的\A 和\Z 锚【但支持以插入符号（^）和美元符号（$）来匹配字符串的开始和结尾】
• 向后查找（lookbehind）【但完全支持向前查找（lookahead）】
• 并集和交集类
• 原子组（atomic grouping）
• Unicode 支持（单个字符除外，如\uFFFF）
• 命名的捕获组【但支持编号的捕获组】
• s（single，单行）和x（free-spacing，无间隔）匹配模式
• 条件匹配
• 正则表达式注释

即使存在这些限制，ECMAScript 正则表达式仍然是非常强大的，能够帮我们完成绝大多数模式匹
配任务。

1. RegExp构造函数属性

适用于作用域中的所有正则表达式，并且基于所执行的最近一次正则表达式操作而变化。

可以通过两种方式访问：长属性名、短属性名（Opera 是例外，它不支持短属性名）

短属性名大多不是有效的ECMAScript 标识符，必须通过方括号语法来访问。

使用这些属性可以从exec()或test()执行的操作中提取出更具体的信息：

var text = "this has been a short summer";
var pattern = /(..)or(.)/g;
if (pattern.test(text)){
alert(RegExp.$1); //sh
alert(RegExp.$2); //t
}

var text = "this has been a short summer";
var pattern = /(.)hort/g;
/*
* 注意：Opera 不支持input、lastMatch、lastParen 和multiline 属性
* Internet Explorer 不支持multiline 属性
*/
if (pattern.test(text)){
alert(RegExp.input); // this has been a short summer
alert(RegExp.leftContext); // this has been a
alert(RegExp.rightContext); // summer
alert(RegExp.lastMatch); // short
alert(RegExp.lastParen); // s
alert(RegExp.multiline); // false
}

var text = "this has been a short summer";
var pattern = /(.)hort/g;
/*
* 注意：Opera 不支持input、lastMatch、lastParen 和multiline 属性
* Internet Explorer 不支持multiline 属性
*/
if (pattern.test(text)){
alert(RegExp.$_); // this has been a short summer
alert(RegExp["$`"]); // this has been a
alert(RegExp["$'"]); // summer
alert(RegExp["$&"]); // short
alert(RegExp["$+"]); // s
alert(RegExp["$*"]); // false
}

2. RegExp实例属性

通过这些属性可以获知一个正则表达式的各方面信息，但却没有多大用处，因为这些信息全都包含在模式声明中。

var pattern1 = /\[bc\]at/i;
alert(pattern1.global); //false
alert(pattern1.ignoreCase); //true
alert(pattern1.multiline); //false
alert(pattern1.lastIndex); //0
alert(pattern1.source); //"\[bc\]at"

var pattern2 = new RegExp("\\[bc\\]at", "i");
alert(pattern2.global); //false
alert(pattern2.ignoreCase); //true
alert(pattern2.multiline); //false
alert(pattern2.lastIndex); //0
alert(pattern2.source); //"\[bc\]at"

3. RegExp实例方法

a. exec()：查找匹配字符串和捕获组

• 参数：正则表达式
• 返回：由匹配项组成的数组；没有匹配项返回null
  • 返回数组，第一项是与整个模式匹配
    的字符串，其他项是与捕获组匹配的字符串（如果模式中没有捕获组，则该数组只包含一项）
    • 假设macth()返回一个数组a，那么a[n]存放的是$n的内容：a[0]存放的是完整的匹配，a[1]存放的是第一个捕获组，以此类推。
  • 返回数组属性：
    • index ：匹配项在字符串中的位置
    • input ：待解析字符串

var text = "mom and dad and baby";
var pattern = /mom( and dad( and baby)?)?/gi;
var matches = pattern.exec(text);
alert(matches.index); // 0
alert(matches.input); // "mom and dad and baby"
alert(matches[0]); // "mom and dad and baby"
alert(matches[1]); // " and dad and baby"
alert(matches[2]); // " and baby"

说明

exec()方法：即使在模式中设置了全局标志g，它每次也只会返回一个匹配项：

• 不设置全局标志g：在同一个字符串上多次调用exec()将始终返回第一个匹配项的信息：

  （特例：IE 在非全局模式下，lastIndex 属性每次也会变化）

  var text = "cat, bat, sat, fat";
  
  var pattern1 = /.at/;
  var matches = pattern1.exec(text);
  
  alert(matches.index); //0
  alert(matches[0]); //cat
  alert(pattern1.lastIndex); //0
  matches = pattern1.exec(text);
  alert(matches.index); //0
  alert(matches[0]); //cat
  alert(pattern1.lastIndex); //0
  

• 设置全局标志g：每次调用exec()会在字符串中继续查找新匹配项：

  var text = "cat, bat, sat, fat";
  
  var pattern2 = /.at/g;
  var matches = pattern2.exec(text);
  
  alert(matches.index); //0
  alert(matches[0]); //cat
  alert(pattern2.lastIndex); //3
  matches = pattern2.exec(text);
  alert(matches.index); //5
  alert(matches[0]); //bat
  alert(pattern2.lastIndex); //8
  

b. test()：判断待解析字符串是否与此模式匹配

• 参数：待解析字符串
• 模式与参数匹配：返回true；否则，返回false

在只想知道目标字符串与某个模式是否匹配，但不需要知道其文本内容时，使用这个方法非常方便。因此，test()方法经常被用在if 语句中：

var text = "000-00-0000";
var pattern = /\d{3}-\d{2}-\d{4}/;
if (pattern.test(text)){
alert("The pattern was matched.");
}

c. 继承的方法

• valueOf()方法：返回正则表达式本身
• toLocaleString()方法：返回正则表达式的字面量，与创建正则表达式的方式无关
• toString()方法：返回正则表达式的字面量，与创建正则表达式的方式无关

var pattern = new RegExp("\\[bc\\]at", "gi");
alert(pattern.toString()); // /\[bc\]at/gi
alert(pattern.toLocaleString()); // /\[bc\]at/gi

三、待解析字符串的string方法

1. search()：查找匹配字符串位置

• 参数：正则表达式
• 返回：匹配子串的起始位置；未找到返回-1.
  • 例: JavaScript.search(/script/i);//返回4

说明：search()方法不支持全局属性检索，所以会忽略匹配模式标志g

2. replace()：替换

• 2个参数：正则，作为替换的字符串
  • 若第一个参数是字符串，replace()则会直接搜索这个字符串
  • 若作为替换字符串中出现了$数字，那么replace()将用与指定的子表达式相匹配的文本来替换这两个字符

text.replace(/javascript/gi,"JavaScript");//将所有不区分大小写的javascript都替换成大小写正确的JavaScript
//一段引用文本起始于引号，结束与引号
//中间的内容区域，不能包含引号
var quote = /"([^"]*)"/g;
//引用中文半角引号替换英文引号，同时要保持引号之间的内容(储存在$1中)没有被修改
text.replace(quote,'“$1”');

3. match()：查找匹配字符串和捕获组

• 参数：正则表达式
• 返回：由匹配结果组成的数组

"1 plus 2 equals 3".match(/\d+/g);//返回["1","2","3"]

说明

• match()始终返回一个数组。若没有匹配模式标志g，只检索第一个匹配，则数组的第一个元素是匹配的字符串，余下的元素是正则表达式中的捕获组（用圆括号括起来的子表达式）。
  • 假设macth()返回一个数组a，那么a[n]存放的是$n的内容：a[0]存放的是完整的匹配，a[1]存放的是第一个捕获组，以此类推。

• 例：解析一个url

var url = /(\w+):\/\/([\w.]+)\/(\S*)/;
var text = "Visit my blog at http://www.example.com/~david";
var result = text.match(url);
if (result != null) {
    var fullurl = result[0]; //包含 "http://www.example.com/"
    var protocol = result[1]; //包含 "http"
    var host = result[2]; //包含 "www.example.com"
    var path = result[3]; //包含~david
}

4. split()：分隔

• 参数：字符串/正则表达式

• 将字符串用传入的分隔符拆分为子串，返回：子串组成的数组

• 例：

// 参数为字符串
"123,456,789".split(",");//返回["123","456","789"]
// 参数为正则表达式
"1,2, 3,4 ,5".split(/\s*,\s*/)//返回["1","2"," 3","4 ","5"]，指定分隔符”,”，允许两边留有任意多的空白符

四、正则表达式语法

1.转义字符

非字母的字符匹配，这些字符需要通过反斜线（\）作前缀进行转义.

具有特殊含义的符号（元字符）

| \ / ( ) [ ] { }  . : ! * + = ^ ? $

想要在正则表达式中对这些字符进行匹配，必须使用前缀”\”

其他标点符号（比如@和引号）无特殊含义，无需转义，直接使用即可。

2.字符类

方括号：或/范围

将直接量字符单独放进方括号内就组成了字符类。一个字符类可以匹配它包含的任意字符。字符类可以使用连字符来表示字符范围。

• 例:
  • /[a,b,c]/：表示和字母”a”,”b”,”c”中的任意一个都匹配
  • /[a-z]/：匹配拉丁字母表中的小写字母
  • /[\s\d]/：匹配任意空白符或数字

3.重复

用以指定字符重复的标记

• 例:

  • /\d{2,4}/:匹配2-4个数字。
  • /\w{3}\d?/:精确匹配三个单词和一个可选的数字。
  • /\s+java\s+/:匹配前后有1个或多个空格的字符串”java”
  • /[^(]*/:匹配0个或多个非左括号的字符(这里实际上能与"("匹配)

注意！

a. *和?能匹配0个字符。因此可以什么都不匹配

• 例:

  • /a*/能匹配字符串”bbbb”，因其含有0个a。

b. 上表中列出的匹配字符为”贪婪的”匹配

贪婪匹配 ：尽可能多地匹配，且允许后续的正则表达式继续匹配

非贪婪匹配 ：只匹配一次，在待匹配的字符后跟随一个问号即可，?，+?，*?或{1,5}?

• 例:
  • /a+/：匹配“aaa”时，三个字符都被匹配,
  • /a+?/：匹配“aaa”时，只匹配第一个a

4.选择-分组和引用

包括：指定选择项，自表达式分组，引用前一子表达式的特殊字符

• 选择项的尝试匹配次序是从左到右，直到发现匹配项，若左边成功匹配就忽略右边的项。
• 正则表达式中圆括号的作用：
  a. 把单独的项组成子表达式，以便于可以像处理独立单元一样，用\|,*,+或者?等等来对单元内的项进行处理
  b. 在完整的模式中定义子模式
  c. 允许在同一正则表达式的后部,引用前面的子表达式

• 例:
  • /ab|cd|ef/：可以匹配”ab”，也可以匹配”cd”，还可以匹配”ef”
  • /\d{3}|[a-z]{4}/：可以匹配3个数字，或者4个小写字母
  • (/[a-z]+(\d+)/)：匹配一个或多个小写字母后跟随了一位或多位数字，使用括号包裹后，可以从检索到的匹配中抽取数字了

5.指定匹配位置

正则表达式的锚，将模式定位在搜索字符串的特定位置上

• 例:
  • /^JavaScript$/:匹配”JavaScript”单词
  • /\B[Ss]cript/:与”JavaScript”和”/postscript”匹配，但不与”script”与”Script”.

（三）常用的正则表达式

以下内容转载自：http://www.cnblogs.com/zxin/archive/2013/01/26/2877765.html

一、校验数字的表达式

1. 数字：^[0-9]*$
2. n位的数字：^\d{n}$
3. 至少n位的数字：^\d{n,}$
4. m-n位的数字：^\d{m,n}$
5. 零和非零开头的数字：^(0|[1-9][0-9]*)$
6. 非零开头的最多带两位小数的数字：^([1-9][0-9]*)+(.[0-9]{1,2})?$
7. 带1-2位小数的正数或负数：^(\-)?\d+(\.\d{1,2})?$
8. 正数、负数、和小数：^(\-|\+)?\d+(\.\d+)?$
9. 有两位小数的正实数：^[0-9]+(.[0-9]{2})?$
10. 有1~3位小数的正实数：^[0-9]+(.[0-9]{1,3})?$
11. 非零的正整数：^[1-9]\d*$ 或 ^([1-9][0-9]*){1,3}$ 或 ^\+?[1-9][0-9]*$
12. 非零的负整数：^\-[1-9][]0-9"*$ 或 ^-[1-9]\d*$
13. 非负整数：^\d+$ 或 ^[1-9]\d*|0$
14. 非正整数：^-[1-9]\d*|0$ 或 ^((-\d+)|(0+))$
15. 非负浮点数：^\d+(\.\d+)?$ 或 ^[1-9]\d*\.\d*|0\.\d*[1-9]\d*|0?\.0+|0$
16. 非正浮点数：^((-\d+(\.\d+)?)|(0+(\.0+)?))$ 或 ^(-([1-9]\d*\.\d*|0\.\d*[1-9]\d*))|0?\.0+|0$
17. 正浮点数：^[1-9]\d*\.\d*|0\.\d*[1-9]\d*$ 或 ^(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*))$
18. 负浮点数：^-([1-9]\d*\.\d*|0\.\d*[1-9]\d*)$ 或 ^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$
19. 浮点数：^(-?\d+)(\.\d+)?$ 或 ^-?([1-9]\d*\.\d*|0\.\d*[1-9]\d*|0?\.0+|0)$

二、校验字符的表达式

1. 汉字：^[\u4e00-\u9fa5]{0,}$
2. 英文和数字：^[A-Za-z0-9]+$ 或 ^[A-Za-z0-9]{4,40}$
3. 长度为3-20的所有字符：^.{3,20}$
4. 由26个英文字母组成的字符串：^[A-Za-z]+$
5. 由26个大写英文字母组成的字符串：^[A-Z]+$
6. 由26个小写英文字母组成的字符串：^[a-z]+$
7. 由数字和26个英文字母组成的字符串：^[A-Za-z0-9]+$
8. 由数字、26个英文字母或者下划线组成的字符串：^\w+$ 或 ^\w{3,20}$
9. 中文、英文、数字包括下划线：^[\u4E00-\u9FA5A-Za-z0-9_]+$
10. 中文、英文、数字但不包括下划线等符号：^[\u4E00-\u9FA5A-Za-z0-9]+$ 或 ^[\u4E00-\u9FA5A-Za-z0-9]{2,20}$
11. 可以输入含有^%&',;=?$"等字符：[^%&',;=?$\x22]+
12. 禁止输入含有~的字符：[^~\x22]+

三、特殊需求表达式

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

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

3. InternetURL：[a-zA-z]+://[^\s]* 或 ^http://([\w-]+\.)+[\w-]+(/[\w-./?%&=]*)?$

4. 手机号码：^(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}$

5. 电话号码("XXX-XXXXXXX"、"XXXX-XXXXXXXX"、"XXX-XXXXXXX"、"XXX-XXXXXXXX"、"XXXXXXX"和"XXXXXXXX)：^(\(\d{3,4}-)|\d{3.4}-)?\d{7,8}$

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

7. 身份证号(15位、18位数字)：^\d{15}|\d{18}$

8. 短身份证号码(数字、字母x结尾)：^([0-9]){7,18}(x|X)?$ 或 ^\d{8,18}|[0-9x]{8,18}|[0-9X]{8,18}?$

9. 帐号是否合法(字母开头，允许5-16字节，允许字母数字下划线)：^[a-zA-Z][a-zA-Z0-9_]{4,15}$

10. 密码(以字母开头，长度在6~18之间，只能包含字母、数字和下划线)：^[a-zA-Z]\w{5,17}$

11. 强密码(必须包含大小写字母和数字的组合，不能使用特殊字符，长度在8-10之间)：^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,10}$

12. 日期格式：^\d{4}-\d{1,2}-\d{1,2}

13. 一年的12个月(01～09和1～12)：^(0?[1-9]|1[0-2])$

14. 一个月的31天(01～09和1～31)：^((0?[1-9])|((1|2)[0-9])|30|31)$

15. 钱的输入格式：

• 有四种钱的表示形式我们可以接受:"10000.00" 和 "10,000.00", 和没有 "分" 的 "10000" 和 "10,000"：^[1-9][0-9]*$
• 这表示任意一个不以0开头的数字,但是,这也意味着一个字符"0"不通过,所以我们采用下面的形式：^(0|[1-9][0-9]*)$
• 一个0或者一个不以0开头的数字.我们还可以允许开头有一个负号：^(0|-?[1-9][0-9]*)$
• 这表示一个0或者一个可能为负的开头不为0的数字.让用户以0开头好了.把负号的也去掉,因为钱总不能是负的吧.下面我们要加的是说明可能的小数部分：^[0-9]+(.[0-9]+)?$
• 必须说明的是,小数点后面至少应该有1位数,所以"10."是不通过的,但是 "10" 和 "10.2" 是通过的：^[0-9]+(.[0-9]{2})?$
• 这样我们规定小数点后面必须有两位,如果你认为太苛刻了,可以这样：^[0-9]+(.[0-9]{1,2})?$
• 这样就允许用户只写一位小数.下面我们该考虑数字中的逗号了,我们可以这样：^[0-9]{1,3}(,[0-9]{3})*(.[0-9]{1,2})?$
• 1到3个数字,后面跟着任意个 逗号+3个数字,逗号成为可选,而不是必须：^([0-9]+|[0-9]{1,3}(,[0-9]{3})*)(.[0-9]{1,2})?$

备注：这就是最终结果了,别忘了"+"可以用"* "替代如果你觉得空字符串也可以接受的话(奇怪,为什么?)最后,别忘了在用函数时去掉去掉那个反斜杠,一般的错误都在这里

16. xml文件：^([a-zA-Z]+-?)+[a-zA-Z0-9]+\\.[x|X][m|M][l|L]$
17. 中文字符的正则表达式：[\u4e00-\u9fa5]
18. 双字节字符：[^\x00-\xff] (包括汉字在内，可以用来计算字符串的长度(一个双字节字符长度计2，ASCII字符计1))
19. 空白行的正则表达式：\n\s*\r (可以用来删除空白行)
20. HTML标记的正则表达式：<(\S*?)[^>]*>.*?</\1>|<.*? /> (网上流传的版本太糟糕，上面这个也仅仅能部分，对于复杂的嵌套标记依旧无能为力)
21. 首尾空白字符的正则表达式：^\s*|\s*$或(^\s*)|(\s*$) (可以用来删除行首行尾的空白字符(包括空格、制表符、换页符等等)，非常有用的表达式)
22. 腾讯QQ号：[1-9][0-9]{4,} (腾讯QQ号从10000开始)
23. 中国邮政编码：[1-9]\d{5}(?!\d) (中国邮政编码为6位数字)
24. IP地址：\d+\.\d+\.\d+\.\d+ (提取IP地址时有用)
25. IP地址：((?:(?:25[0-5]|2[0-4]\\d|[01]?\\d?\\d)\\.){3}(?:25[0-5]|2[0-4]\\d|[01]?\\d?\\d))

（四）参考资料

JavaScript高级程序设计
正则表达式-理论基础篇
最全的常用正则表达式大全