一张图帮你搞定正则,不怕不怕了

184 阅读2分钟

这是我参与11月更文挑战的第7天,活动详情查看:2021最后一次更文挑战

背景

学过正则,但是记不住,用到的时候又不会写,这次总结一下。 学习的时候可以用Chrome插件FeHelper的JS正则表达式工具测试。

我们划分好分类,来帮助我们更好的记忆。

正则表达式语法

/正则表达式主题/修饰符(可选)

我们可以看到基本语法就是两个斜杠。

例子:

 var c=/\d/

验证一下:

image.png

修饰符

  • i 执行对大小写不敏感的匹配
  • g 执行全局匹配(查找所有匹配,不是查找到一个元素后停止)
  • m 执行多行匹配

我们修改下上面的正则:加一个全局匹配

var c=/\d/g

image.png

正则表达式中元字符分类

这里的"元字符"指在正则表达式中有特殊意义的字符。

image.png

特殊单字符

这里指表示特殊单个字符的元字符。 我们用图来表示:

image.png

我们从图中可以看出\d,\w,\s 与大写的\D, \W,\S是取反的关系。

空白字符

我们在处理文本的时候,经常会遇到空白符,这些空白符,可以是空格,可以是换行,可以是tab等,我们怎么匹配它们呢?看下图就行:

image.png

范围

用来限制一定的范围内的元素。

image.png

验证一下:

image.png

image.png

量词

上面说的都是一个元素,这个量词代表某个部分重复的次数。 image.png

测试一下:

image.png

断言

这里的断言代表的是对文本位置有要求。

image.png

单词边界

如果我们要匹配一句中文中某个单词出现的次数,这个时候就需要区分单词是一个整体了,需要区分单词左右两边有空格。

比如我们要查找"tomorrow"这个单词出现的次数,我们是不是会这么写?

image.png

但是这样匹配是错误的,这样只匹配了右边的单词边界。我们需要左边也加上\b

image.png

环视

环视指的是匹配单词的左右两边!这里记住一个规则:有左尖括号代表左边。没有尖括号代表右边。

比如我们一个邮政编码 6位数的数字

错误写法:

image.png

正确写法: 匹配规则左边不是数字,中间六位数字,右边不是数字

image.png

完整正则规则图:

image.png