# 2一、正则表达式字符匹配攻略
# 1.1模糊匹配
- 对于大多数场景,精确匹配是没有意义的,如
/hello/
只能匹配字符串的"hello"
这个子串
let regex = /hello/;
console.log(regex.test("hello")); // true
console.log(regex.test("hello1")); // true
console.log(regex.test("hdllo1")); // false
- 正则的强大归功于模糊匹配,分为横向模糊与纵向模糊
# 1.1.1横向模糊
- 一个正则可匹配的字符串的长度不是固定的,可以是多种情况的。
- 比如正则
/ab{2,5}c/
表示匹配这样一个字符串:第一个字符是 "a",接下来是 2 到 5 个字符是 "b"(2个b——5个b,1个和6个都不行),最后 是字符 "c"
let regex1 = /ab{2,5}c/g // 开始是a,2-5个是b,结束是c
let string = "abc abbc abbbc abbbbc abbbbbc abbbbbbc";
console.log(string.match(regex1));
// [ 'abbc', 'abbbc', 'abbbbc', 'abbbbbc' ]
- 注意,
/ab{2,5}c/g
中的g(global)代表这个字符串所有的子集,返回一个数组,下面是没有g的输出:
# 1.1.2纵向模糊
- 匹配某一个字符串,可以不是某个确定的字符,如[a,b,c],表示"a", "b", "c"中的任何一个
- 如
/a[123]b/
可以匹配:"a1b", "a2b", "a3b"
- 如
// 纵向模糊匹配
let regex2 = /a[123]b/g // 可以匹配所有情况为:a1b a2b a3b
let string1 = "a0c a1b a2b a3b a4b";
console.log(string1.match(regex2));
// [ 'a1b', 'a2b', 'a3b' ]
# 1.2字符组
- 虽然是字符组,但只是其中一个字符
- 例如
[abc]
,表示匹配一个字符,他可以是a,b,v之一
# 1.2.1范围表示法
- 如果要匹配数组0-9的,字母a-z的,难道需要写入10个数字和26个字母吗?虽然可以,但是效率和可读性都是非常差的。
- 比如
[123456abcdefGHIJKLM]
,可以写成[1-6a-fG-M]
。 - 那么又有一个问题,如果想要匹配字符串a-z三个中的一个呢?
- 答案肯定是不能
[a-z]
,因为其表示了任意小写字母 - 需要写成
[-az]
||[az-]
||[a\-z]
- 答案肯定是不能
# 1.2.2排除字符组
- 纵向模糊匹配中,还有一种情况是,字符串不能有某些字符,比如说不能有a || b || c
- 如
[^abc]
表示是除了a,b,c之外的任意一个字符,^表示求反。
# 1.2.3常见的简写形式
字符组 | 具体含义 |
---|---|
\d | 表示[0-9],是一个数字 |
\D | 表示["^"0-9],表示除了数字外的任意字符 |
\w | 表示[0-9a-z-A-Z_]。表示数字、大小写字母和下划线 |
\W | 表示["^"0-9a-zA-Z_] |
\s | 表示[\t\v\n\r\f]。表示空白符,包括空格,水平制表符、垂直制表符、换行符、回车符、换页符 |
\S | 非空白符 |
. | [^\n\r\u2028\u2029]。通配符,表示几乎任意字符。换行符、回车符、行分隔符和段分隔符 除外。 |
想要匹配任意字符怎么办?可以使用 [\d\D],[\w\W]、[\s\W]和[^]
# 1.3量词
- 量词也称重复,掌握
{m,n}
的准确含义后,只需要记住一些简写形式。
# 1.3.1简写形式
量词 | 具体含义 |
---|---|
{m,} | 表示至少出现m次 |
{m} | 等价于{m,m},表示出现m次 |
? | 等价于{0,1},表示出现或者不出现 |
+ | 等价于{1,},表现出现至少一次 |
* | 等价于{0,},表示出现任意次,有可能不出现 |
# 1.3.2贪婪性和惰性匹配
贪婪匹配例子:
- 表示出现数字的次数为2到5次,会匹配2,3,4,5位连续数字
- 但它是贪婪的,会尽可能多的匹配,6个要5个,3个就要3个
let regex = /\d{2,5}/g
let string = "123 1234 12345 123456"
console.log(string.match(regex));
// [ '123', '1234', '12345', '12345' ]
惰性匹配:
- 尽可能少的匹配
- 我找到连续两个就够了,就不再继续往下匹配
let regex = \/d{2,5}?\g;
let string = "123 1234 12345 123456";
console.log(string.match(regex));
# 1.4多分支选择
- 如要匹配good或nice,可以使用
/good|nice/
- 但是需要注意的点:
/good|goodbye/
去匹配"goodbye"
就只能匹配到 good,而没有goodbye - 所以分支结构也是惰性的,前面的匹配上了,后面就不再尝试,就是
good
把goodbye
匹配上了,goodbye
就不会去匹配goodbye
了
let regex = /good|nice/g;
let string = "nice, is good!"
let string1 = "nice, is !"
console.log(string.match(regex)) // [nice, good]
console.log(string1.match(regex)) // [nice]
# 1.5例子分析
- 匹配字符,是字符组,量词,结构分支的组合,每个正则不是只有唯一写法
# 1.5.1匹配16进制颜色值
要求匹配:#ffbbad
,#Fc01DF
,#FFF
,#ffE
← TypeScript笔记 项目样式重置 →