出来混总是要还的-JS正则表达式( 连字符 + 字符 + 量词 + 管道符 + 括号 )

前言：学会了常见"字符类"与"量词", 加上上篇文章写到的 正则的四种操作 , 就可以解决大部分常情形。

最麻烦最杂乱无章的字符, 只有 5 个需要记忆, 其他的只要看一遍就记住了。其实最麻烦的还是需求和规则的匹配 -> 规则实际落地

范围表示: 用连字符 - 来省略和简写

[123456] === [1-6] , [abcdef] === [a-f]

常见的字符简写形式

• \d: 表示[0-9], 数字, 其英文 digit(数字)

• \w: 表示[0-9a-zA-Z_], 数字字母下划线, 其英文 word

• \s: 表示[\t\v\n\r\f], 空白符(空格、水平(垂直)制表符、换行符、回车符、换页符), 其英文 space

• . : 通配符, 表示几乎任意字符, 换行符、回车符、行分隔符、段分隔符除外。

• 如果要匹配任意字符: 可以使用[\d\D], [\w\W], [\s\S], [^]四个中的任意一个

• \D: \d 取反, \W: \w 取反, \S: \s 取反

常见量词

1. {m} : 出现 m 次
2. {m,}: 至少出现 m 次
3. ? : 出现或不出现, 直译: 知道吗? 知道1 or 不知道0
4. + ：至少出现一次
5. * : 出现任意次数

多选分支|(管道符)

支持多个子模式任选其一, (s1|s2|s3), 其中任意一个。管道符就像正则里的或(||),左侧false时执行右侧

括号的作用

1. 括号最原始的功能, 就是强调括号内的正则是一个整体
2. 多选分支结构(s1|s2), 提供了表达式的所有可能
3. 分组 -> 分组引用 -> 数据提取

---

上面了解了连字符、常见字符的简写、常见量词、管道符( 或? )、括号的基本功能, 下面上两个 Demo 从规则解析一步步来分析

Demo1

匹配日期 2020-01-01

/**
 * 规则解析
 * 规则1： 年 - 任意四位数字  \d{4}
 * 规则2： 月 - 一共12个月 (0[1-9]|1[0-2])
 *    2-1. 0开头 01、02、03 ... 09
 *    2-2. 1开头 10、11、12
 * 规则3： 日 - 最大31天 (0[1-9]|[12]\d|3[01])
 *    3-1. 01、02、03 ... 09
 *    3-2. 10、11、12 ... 19
 *         20、21、22 ... 29
 *    3-3. 30、31
 */
let regex = /^\d{4}-(0[1-9]|1[0-2])-(0[1-9]|[12]\d|3[01])$/;
console.log(regex.test("2018-10-22"));
复制代码

Demo2

匹配 Email ntscshen@163.com

/**
 * 规则解析
 * 规则1：以数字字母下划线中划线点开头, 且重复一到多次( 至少一次 ), 可以为中文[\u4e00-\u9fa5]
 * 规则2：中间必须包含@符 \@
 * 规则3：@符之后链接 数字字母下划线中划线点, 且重复至少一次 ([A-Za-z0-9_\-\.])+
 * 规则4：结尾必须是点, 且连接2-8位大小写字母 \.([A-Za-z]{2,8})
 */
let regex = /^([A-Za-z0-9_\-\.\u4e00-\u9fa5])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,8})$/;
console.log(regex.test("ntscshen#@163.com"));
console.log(regex.test("cn42du@163.com"));
console.log(regex.test("ifat3@sina.com.cn"));
console.log(regex.test("ifat3.it@163.com"));
console.log(regex.test("ifat3_-.@42du.cn"));
console.log(regex.test("ifat3@42du.online"));
console.log(regex.test("毛三胖@42du.cn"));
复制代码

转载于:https://juejin.im/post/5bcd89f8f265da0ade1cf3db