Fork me on GitHub

前端进阶深入系列之【正则表达式】

正则表达式。

一、什么是正则表达式

1.1

1.2 精准匹配

输入的是什么,就匹配什么。

实例:

1
/7/g

匹配文本如下:

1
2
// 匹配数:4 个 7 
707-827-7019

1.3 字符组匹配数字

【】是正则表达式中的元字符,方括号不参与匹配。

【0-9】在正则表达式中叫做字符组,也叫字符集。主要用来限定匹配的字符集,如【12356】,或者【0-9】。

实例:

1
/[0-9]/g

匹配文本如下:

1
2
// 匹配文本中的所有数字(除 - 外的数字)
707-827-7019
1
2
// 匹配上述的电话字符串
[0-9][0-9][0-9]-[0-9][0-9][0-9]-[0-9][0-9][0-9][0-9]

1.4 字符组简写式

之前匹配数字使用到的 【0-9】字符组,我们也可以使用简式,照样可以进行数字的匹配,如:\d 就可以匹配所有的数字。我们称这种形式叫做字符简写式,也叫转义字符。

  • “[]” : 字符分组
  • “\d” : 匹配数字
  • “\D” : 匹配非数字
1
2
3
4
5
// 匹配上述的字符串
/\d\d\d-\d\d\d-\d\d\d\d/g

// 也可以使用 \D 代替非数字字符
/\d\d\d\D\d\d\d\D\d\d\d\d/g

匹配非数字字符:(\D)

1.5 匹配任意字符(.)

英文 . 号是一个通配符,可以匹配任意字符(某些情况不能匹配行起始符)

  • “.” : 匹配任意字符。

我们还可以用(.) 来匹配任意的连字符。

1
/\d\d\d.\d\d\d.\d\d\d\d/g

同时可以匹配的文本如下:

1
2
707%827%7019
707|827|7019

1.6 捕获分组和后向引用

  • “()” : 为捕获分组。匹配括号内的内容。

1.7 使用量词

使用另外一种语法来匹配电话号码。{} 花括号就是一个量词,里边用来写匹配的次数。同时 ? 号也是一个量词。

PS:下面的正则表示的是都紧跟匹配的字符后生效。

  • “{} “: 括号内填匹配的次数,可以是多个如:{2,3} 两次或三次;
  • “?” : 表示可选可不选;
  • “+” : 表示一个或多个;
  • “*” : 零个或多个;
1
2
// 继续匹配上述的电话号
\d{3}-?\d{3}-?\d{4}

最简洁的匹配电话号码:

1
2
// 简化版(但是不能正确匹配) 因为前两个分隔符数字可以是三位和四位—— 我们要控制前两组为三位
(\d{3,4}-?)+
1
2
// 改进后的正则
(\d{3}-?){2}\d{4}

1.8 括选文字符

例子:(707)-827-7019 括号内的区号可选可不选。

1
^(\(\d{3}\)|^\d{3}[.-]?)?\d{3}[.-]?\d{4}$
  • “|” : 表示选择。也就是从多个选项中选择一个。
  • “^” : 脱字符,表示会出现在第一行的位置。
  • “$” :美元匹配代表匹配行的结束位置。
1
2
3
(123)827-7019
827-7019
123-827-7019