先来一个小案例
- 校验邮箱
const reg = /^[a-zA-Z]([a-zA-Z]|[0-9])+[\w|\-|\.][a-zA-Z0-9]+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/;
// reg.test(str1) = false
const str1 = `326jghjdh.gyigk@hkuh.cjj`;
// reg.test(str2) = true
const str2 = `a562bdh.gyigk@hkuh.cjj`;
// reg.test(str3) = true
const str3 = `a56hjdh-gyigk@hkuh.cjj`;
// reg.test(str4) = true
const str4 = `a562hjdh_gyigk@hkuh.cjj`;
// reg.test(str5) = false
const str5 = `62byigk@hkuh.cjj`;
分段讲解
// 完整校验表达式
^[a-zA-Z]([a-zA-Z]|[0-9])(\w|\-|\.)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$
^[a-zA-Z]
^ 字符串开始的位置
a-z 所有小写字母
A-Z 所有大写字母
^[a-zA-Z] 以字母开头
([a-zA-Z]|[0-9])+
() 子字符串开始和结束的位置
[] 包含的元素集合
| 指明多项之间的选择，此处为2项
0-9 所有数字
+ 匹配前面的子表达式一次或多次
([a-zA-Z]|[0-9])+ 小写字母或者大写字母开头，从第二位开始数字和大小写字母不限次数和顺序
[\w|\-|\.]
\w 字母
\- 横线或下划线
\. 点
[\w|\-|\.] 仅包含一个字母/横线/下划线/点
@
含有@符号
[a-zA-Z0-9]+
[a-zA-Z0-9]+ 小写字母、大写字母、数字交叉多次使用，或者使用至少一个
和 ([a-zA-Z]|[0-9])+ 含义相同
\.
\. 含一个点
([a-zA-Z]{2,4})$
[a-zA-Z] 大小写字母1位
{2,4} 限定数量为2~4位
$ 结束符
([a-zA-Z]{2,4}) 2~4位大小写字母混装
([a-zA-Z]{2,4})$ 以2~4位大小写字母混装结尾
'[0-9]+ 包含0的十位数字组合
[1-9]+ 不包含0的九位数字组合'
常用语法
非打印字符
\cx \f \n \r \s \S \t \v
\cx 匹配由x指明的控制字符。例如， \cM 匹配一个 Control-M 或回车符。x 的值必须为 A-Z 或 a-z 之一。否则，将 c 视为一个原义的 'c' 字符。
\f 匹配一个换页符。等价于 \x0c 和 \cL。
\n 匹配一个换行符。等价于 \x0a 和 \cJ。
\r 匹配一个回车符。等价于 \x0d 和 \cM。
\s 匹配任何空白字符，包括空格、制表符、换页符等等。等价于 [ \f\n\r\t\v]。注意 Unicode 正则表达式会匹配全角空格符。
\S 匹配任何非空白字符。等价于 [^ \f\n\r\t\v]。
\t 匹配一个制表符。等价于 \x09 和 \cI。
\v 匹配一个垂直制表符。等价于 \x0b 和 \cK。
特殊字符
$ () * + . [ ? \ ^ { |
$ 匹配输入字符串的结尾位置。如果设置了 RegExp 对象的 Multiline 属性，则 $ 也匹配 '\n' 或 '\r'。要匹配 $ 字符本身，请使用 \$。
() 标记一个子表达式的开始和结束位置。子表达式可以获取供以后使用。要匹配这些字符，请使用 \( 和 \)。
* 匹配前面的子表达式零次或多次。要匹配 * 字符，请使用 \*。
+ 匹配前面的子表达式一次或多次。要匹配 + 字符，请使用 \+。
. 匹配除换行符 \n 之外的任何单字符。要匹配 . ，请使用 \. 。
[ 标记一个中括号表达式的开始。要匹配 [，请使用 \[。
? 匹配前面的子表达式零次或一次，或指明一个非贪婪限定符。要匹配 ? 字符，请使用 \?。
\ 将下一个字符标记为或特殊字符、或原义字符、或向后引用、或八进制转义符。例如， 'n' 匹配字符 'n'。'\n' 匹配换行符。序列 '\\' 匹配 "\"，而 '\(' 则匹配 "("。
^ 匹配输入字符串的开始位置，除非在方括号表达式中使用，当该符号在方括号表达式中使用时，表示不接受该方括号表达式中的字符集合。要匹配 ^ 字符本身，请使用 \^。
{ 标记限定符表达式的开始。要匹配 {，请使用 \{。
| 指明两项之间的一个选择。要匹配 |，请使用 \|。
'* 和 + 限定符都是贪婪的，因为它们会尽可能多的匹配文字，只有在它们的后面加上一个 ? 就可以实现非贪婪或最小匹配。'
贪婪
/<.*>/ 匹配从开始小于符号 (<) 到大于符号 (>) 之间的所有内容。
非贪婪
/<\w+?>/ 匹配第一个<和第一个>之间的所有内容。
限定符
* + ? {n} {n,} {n,m}
* 匹配前面的子表达式零次或多次。例如，zo* 能匹配 "z" 以及 "zoo"。* 等价于{0,}。
+ 匹配前面的子表达式一次或多次。例如，'zo+' 能匹配 "zo" 以及 "zoo"，但不能匹配 "z"。+ 等价于 {1,}。
? 匹配前面的子表达式零次或一次。例如，"do(es)?" 可以匹配 "do" 、 "does" 中的 "does" 、 "doxy" 中的 "do" 。? 等价于 {0,1}。
{n} n 是一个非负整数。匹配确定的 n 次。例如，'o{2}' 不能匹配 "Bob" 中的 'o'，但是能匹配 "food" 中的两个 o。
{n,} n 是一个非负整数。至少匹配n 次。例如，'o{2,}' 不能匹配 "Bob" 中的 'o'，但能匹配 "foooood" 中的所有 o。'o{1,}' 等价于 'o+'。'o{0,}' 则等价于 'o*'。
{n,m} m 和 n 均为非负整数，其中n <= m。最少匹配 n 次且最多匹配 m 次。例如，"o{1,3}" 将匹配 "fooooood" 中的前三个 o。'o{0,1}' 等价于 'o?'。请注意在逗号和两个数之间不能有空格。
定位符
^ $ \b \B
^ 匹配输入字符串开始的位置。如果设置了 RegExp 对象的 Multiline 属性，^ 还会与 \n 或 \r 之后的位置匹配。
$ 匹配输入字符串结尾的位置。如果设置了 RegExp 对象的 Multiline 属性，$ 还会与 \n 或 \r 之前的位置匹配。
\b 匹配一个单词边界，即字与空格间的位置。
\B 非单词边界匹配。
'注意：不能将限定符与定位符一起使用。由于在紧靠换行或者单词边界的前面或后面不能有一个以上位置，因此不允许诸如 ^* 之类的表达式。
若要匹配一行文本开始处的文本，请在正则表达式的开始使用 ^ 字符。不要将 ^ 的这种用法与中括号表达式内的用法混淆。
若要匹配一行文本的结束处的文本，请在正则表达式的结束处使用 $ 字符。'
选择
'用圆括号将所有选择项括起来，相邻的选择项之间用|分隔。但用圆括号会有一个副作用，使相关的匹配会被缓存，此时可用?:放在第一个选项前来消除这种副作用。
其中 ?: 是非捕获元之一，还有两个非捕获元是 ?= 和 ?!，这两个还有更多的含义，前者为正向预查，在任何开始匹配圆括号内的正则表达式模式的位置来匹配搜索字符串，后者为负向预查，在任何开始不匹配该正则表达式模式的位置来匹配搜索字符串。'
反向引用
'对一个正则表达式模式或部分模式两边添加圆括号将导致相关匹配存储到一个临时缓冲区中，所捕获的每个子匹配都按照在正则表达式模式中从左到右出现的顺序存储。
缓冲区编号从 1 开始，最多可存储 99 个捕获的子表达式。
每个缓冲区都可以使用 \n 访问，其中 n 为一个标识特定缓冲区的一位或两位十进制数。
可以使用非捕获元字符 ?:、?= 或 ?! 来重写捕获，忽略对相关匹配的保存。'
最后给大家介绍一个测试正则表达式的在线工具 regex101.com/codegen?lan… 参考内容原自 www.runoob.com/regexp/rege…
