JavaScript 正则表达式详解

1. 正则表达式创建

JavaScript 有两种方式创建正则表达式：

第一种：直接通过/正则表达式/写出来
第二种：通过new RegExp(\’正则表达式\’)创建一个RegExp对象

const re1 = /ABC\\-001/;const re2 = new RegExp(\'ABC\\\\-001\');re1; // /ABC\\-001/re2; // /ABC\\-001/

注意，如果使用第二种写法，因为字符串的转义问题，字符串的两个\\实际上是一个\\。

2. 使用模式

2.1 使用简单模式

简单的模式是由找到的直接匹配所构成的。比如，/abc/这个模式就匹配了在一个字符串中，仅仅字符 \’abc\’ 同时出现并按照这个顺序。在 \”Hi, do you know your abc\’s?\” 和 \”The latest airplane designs evolved from slabcraft.\” 就会匹配成功。在上面的两个实例中，匹配的是子字符串 \’abc\’。在字符串 \”Grab crab\” 中将不会被匹配，因为它不包含任何的 \’abc\’ 子字符串。

2.2 使用特殊字符

例如：模式/abc/匹配了一个单独的 \’a\’ 后面跟了零个或者多个 \’b\’（的意思是前面一项出现了零个或者多个），且后面跟着 \’c\’ 的任何字符组合。在字符串 \”s\’scbbabbbbcdebc\” 中，这个模式匹配了子字符串 \”abbbbc\”。

字符	含义
\\	匹配将依照下列规则：在非特殊字符之前的反斜杠表示下一个字符是特殊的，不能从字面上解释。例如，前面没有\’\’的\’d\’通常匹配小写\’d\’。如果加了\’\’,这个字符变成了一个特殊意义的字符，意思是匹配一个数字。反斜杠也可以将其后的特殊字符，转义为字面量。例如，模式 /a/ 代表会匹配 0 个或者多个 a。相反，模式 /a/ 将 \’\’ 的特殊性移除，从而可以匹配像 \”a\” 这样的字符串。使用 new RegExp(\”pattern\”) 的时候也不要忘记将 \\ 进行转义，因为 \\ 在字符串里面也是一个转义字符。
^	匹配输入的开始，例如，/^A/ 并不会匹配 \”an A\” 中的 \’A\’，但是会匹配 \”An E\” 中的 \’A\’。
$	匹配输入的结束。例如，/t$/ 并不会匹配 \”eater\” 中的 \’t\’，但是会匹配 \”eat\” 中的 \’t\’。
*	匹配前一个表达式0次或多次。等价于 {0,}。例如，/bo*/会匹配 \”A ghost boooooed\” 中的 \’booooo\’
+	匹配前面一个表达式1次或者多次。等价于 {1,}。例如，/a+/匹配了在 \”candy\” 中的 \’a\’，和在 \”caaaaaaandy\” 中所有的 \’a\’。
?	匹配前面一个表达式0次或者1次。等价于 {0,1}。例如，/e?le?/ 匹配 \”angel\” 中的 \’el\’，和 \”angle\” 中的 \’le\’ 以及\”oslo\’ 中的\’l\’。如果紧跟在任何量词 *、 +、? 或 {} 的后面，将会使量词变为非贪婪的（匹配尽量少的字符），和缺省使用的贪婪模式（匹配尽可能多的字符）正好相反。例如，对 \”123abc\” 应用 /\\d+/ 将会返回 \”123\”，如果使用 /\\d+?/,那么就只会匹配到 \”1\”。
.	匹配除换行符之外的任何单个字符。例如，/.n/将会匹配 \”nay, an apple is on the tree\” 中的 \’an\’ 和 \’on\’，但是不会匹配 \’nay\’。
x	y
{n}	n是一个正整数，匹配了前面一个字符刚好发生了n次。比如，/a{2}/不会匹配“candy”中的\’a\’,但是会匹配“caandy”中所有的a，以及“caaandy”中的前两个\’a\’。
{n,m}	n 和 m 都是整数。匹配前面的字符至少n次，最多m次。如果 n 或者 m 的值是0，这个值被忽略。例如，/a{1, 3}/ 并不匹配“cndy”中的任意字符，匹配“candy”中的a，匹配“caandy”中的前两个a，也匹配“caaaaaaandy”中的前三个a。注意，当匹配”caaaaaaandy“时，匹配的值是“aaa”，即使原始的字符串中有更多的a。
[xyz]	一个字符集合。匹配方括号中的任意字符，包括转义序列。你可以使用破折号（-）来指定一个字符范围。对于点（.）和星号（*）这样的特殊符号在一个字符集中没有特殊的意义。他们不必进行转义，不过转义也是起作用的。例如，[abcd] 和[a-d]是一样的。他们都匹配\”brisket\”中的‘b\’,也都匹配“city”中的‘c\’。/[a-z.]+/ 和/[\\w.]+/与字符串“test.i.ng”匹配。
[^xyz]	一个反向字符集。也就是说，它匹配任何没有包含在方括号中的字符。你可以使用破折号（-）来指定一个字符范围。任何普通字符在这里都是起作用的。
\\b	匹配一个词的边界。一个词的边界就是一个词不被另外一个“字”字符跟随的位置或者没有其他“字”字符在其前面的位置。注意，一个匹配的词的边界并不包含在匹配的内容中。换句话说，一个匹配的词的边界的内容的长度是0。例如： /\\bm/匹配“moon”中的‘m\’；/oo\\b/并不匹配\”moon\”中的\’oo\’，因为\’oo\’被一个“字”字符\’n\’紧跟着。/oon\\b/匹配\”moon\”中的\’oon\’，因为\’oon\’是这个字符串的结束部分。这样他没有被一个“字”字符紧跟着。
\\d	匹配一个数字。等价于[0-9]。例如， /\\d/ 或者 /[0-9]/ 匹配\”B2 is the suite number.\”中的\’2\’。
\\D	匹配一个非数字字符。等价于[^0-9]。例如， /\\D/ 或者 /[^0-9]/ 匹配\”B2 is the suite number.\”中的\’B\’ 。
\\f	匹配一个换页符 (U+000C)。
\\n	匹配一个换行符 (U+000A)。
\\r	匹配一个回车符 (U+000D)。
\\s	匹配一个空白字符，包括空格、制表符、换页符和换行符。等价于[ \\f\\n\\r\\t\\v\\u00a0\\u1680\\u180e\\u2000-\\u200a\\u2028\\u2029\\u202f\\u205f\\u3000\\ufeff]。例如, /\\s\\w*/ 匹配\”foo bar.\”中的\’ bar\’。
\\S	匹配一个非空白字符。等价于[^ \\f\\n\\r\\t\\v\\u00a0\\u1680\\u180e\\u2000-\\u200a\\u2028\\u2029\\u202f\\u205f\\u3000\\ufeff]。例如， /\\S\\w*/ 匹配\”foo bar.\”中的\’foo\’。
\\t	匹配一个水平制表符 (U+0009)。
\\w	匹配一个单字字符（字母、数字或者下划线）。等价于[A-Za-z0-9_]。例如, /\\w/ 匹配 \”apple,\” 中的 \’a\’，\”$5.28,\”中的 \’5\’ 和 \”3D.\” 中的 \’3\’。
\\W	匹配一个非单字字符。
\\n	在正则表达式中，它返回最后的第n个子捕获匹配的子字符串(捕获的数目以左括号计数)。

3. 应用

3.1 切分字符串

用正则表达式切分字符串比用固定的字符更灵活，通常的切分代码：

\'a d   c\'.split(\' \'); // [\'a\', \'d\', \'\', \'\', \'c\']

上面方法无法识别连续的空格，改用正则表达式：

\'a b   c\'.split(/\\s+/); // [\'a\', \'b\', \'c\']

无论多少个空格都可以正常分割。再加入‘,\’：

\'a,b, c  d\'.split(/[\\s\\,]+/); // [\'a\', \'b\', \'c\', \'d\']

再加入;：

\'a,b;; c  d\'.split(/[\\s\\,\\;]+/); // [\'a\', \'b\', \'c\', \'d\']

所以，可以用正则表达式来把不规范的输入转化成正确的数组。

3.2 分组

除了判断是否匹配之外，正则表达式还可以提取子串，用()表示的就是要提取的分组（Group）。比如：

^(\\d{4})-(\\d{4,9})$分别定义了两个组，可以直接从匹配的字符串中提取出区号和本地号码：

var re = /^(\\d{4})-(\\d{4,9})$/;re.exec(\'0530-12306\'); // [\'010-12345\', \'010\', \'12345\']re.exec(\'0530 12306\'); // null

exec()方法在匹配成功后，返回一个数组，第一个元素是正则表达式匹配到的整个字符串，后面的字符串表示匹配成功的子串。

exec()方法在匹配失败时返回null。

3.3 贪婪匹配

注意，正则匹配默认是贪婪匹配，也就是匹配尽可能多的字符。如下，匹配出数字后面的0：

var re = /^(\\d+)(0*)$/;re.exec(\'102300\'); // [\'102300\', \'102300\', \'\']

由于\\d+采用贪婪匹配，直接把后面的0全部匹配了，结果0*只能匹配空字符串了。

必须让\\d+采用非贪婪匹配（也就是尽可能少匹配），才能把后面的0匹配出来，加个?就可以让\\d+采用非贪婪匹配：

var re = /^(\\d+?)(0*)$/;re.exec(\'102300\'); // [\'102300\', \'1023\', \'00\']

3.4 正则表达式标志

g	全局搜索。i	不区分大小写搜索。m	多行搜索。y	执行“粘性”搜索,匹配从目标字符串的当前位置开始，可以使用y标志。

3.5 test() 方法

test() 方法用于检测一个字符串是否匹配某个模式，如果字符串中含有匹配的文本，则返回 true，否则返回 false。

var re = /^(\\d{4})-(\\d{4,9})$/;re.test(\'0530-12321\'); // truere.test(\'0530-123ab\'); // falsere.test(\'0530 12321\'); // false

4. 常用正则（参考）

验证Email地址：^\\w+[-+.]\\w+)*@\\w+([-.]\\w+)*\\.\\w+([-.]\\w+)*$验证身份证号（15位或18位数字）：^\\d{15}|\\d{}18$中国大陆手机号码：1\\d{10}中国大陆固定电话号码：(\\d{4}-|\\d{3}-)?(\\d{8}|\\d{7})中国大陆邮政编码：[1-9]\\d{5}IP地址：((2[0-4]\\d|25[0-5]|[01]?\\d\\d?)\\.){3}(2[0-4]\\d|25[0-5]|[01]?\\d\\d?)日期(年-月-日)：(\\d{4}|\\d{2})-((1[0-2])|(0?[1-9]))-(([12][0-9])|(3[01])|(0?[1-9]))日期(月/日/年)：((1[0-2])|(0?[1-9]))/(([12][0-9])|(3[01])|(0?[1-9]))/(\\d{4}|\\d{2})验证数字：^[0-9]*$验证n位的数字：^\\d{n}$验证至少n位数字：^\\d{n,}$验证m-n位的数字：^\\d{m,n}$验证零和非零开头的数字：^(0|[1-9][0-9]*)$验证有1-3位小数的正实数：^[0-9]+(.[0-9]{1,3})?$验证非零的正整数：^\\+?[1-9][0-9]*$验证非零的负整数：^\\-[1-9][0-9]*$验证非负整数（正整数 + 0） ^\\d+$验证非正整数（负整数 + 0） ^((-\\d+)|(0+))$验证长度为3的字符：^.{3}$验证由26个英文字母组成的字符串：^[A-Za-z]+$验证由26个大写英文字母组成的字符串：^[A-Z]+$验证由26个小写英文字母组成的字符串：^[a-z]+$验证由数字和26个英文字母组成的字符串：^[A-Za-z0-9]+$

总结

本篇文章就到这里了，希望能够给你带来帮助，也希望您能够多多关注脚本之家的更多内容！

您可能感兴趣的文章:

js正则表达式之前瞻后顾与非捕获分组
JavaScript中正则表达式的实际应用详解
js用正则表达式筛选年月日的实例方法
js正则表达式简单校验方法
Js利用正则表达式去除字符串的中括号
javascript使用正则表达式实现注册登入校验

目录