JavaScript正则表达式

最近在用Angular写一些表单验证的时候经常用到一些正则表达式,比如简单的手机号,邮件,URL验证,参照视频教程系统的记录一下正则表达式。

首先第一个问题,什么是正则表达式:

正则表达式(Regular Expression)是使用单个字符串来描述,匹配一系列符合某种句法规则的字符串。我的理解就是用字符串来定义一组规则,用来校验或者修改另一组字符串。

正则表达式有个在线工具叫:regexper 地址:https://regexper.com/。可以在线使用,也可下载。用来可视化的解析正则表达式。

比如说\d{3,5},意思是3位数到5位数的数字,用regexper表示如图:


PS. regexper在线访问比较慢,常用的话最好本地安装。

接下来介绍详细语法

一,修饰符

1.g: global全文搜索,如果不添加g,则只搜查符合条件的第一个字符串

比如:


/\bis\b/ 的意思是找出第一个字符串is  ,

/\bis\b/g的意思是找出所有字符串is ,

\b的意思是字符边界,意思是只找出单词is,刚刚例子中的This 中也有is,但却没有被替换就是因为\b的作用。

2 i :ignore case 忽略大小写 ,不加i 的话默认是大小写敏感的

比如


3 m:multiple lines 多行搜索


二:原义字符和元字符

原义字符:就是表达字符本身的意思,比如abc,123什么的 还有比如上面例子中的is。 

元字符:正则表达式中具有特殊含义的非字母字符,比如刚刚上面讲到的\b,\b的意思并不是匹配\和b,而是表示单词边界;

以下字符在正则表达式中都是有特殊含义的:

* + ? $ ^ . | \ ( ) { } [ ]

以及下表几个常用的元字符

字符含义
\t水平制表符
\v垂直制表符
\n换行符
\r回车符
\0空字符
\f换页符

下面一一介绍以上元字符

1,[ ]表示一类字符  ^表示非字符

[ ] 用来构建一个简单的类,所谓类就是符合某些特征的对象,一个泛指,而不是特指某个字符

比如abc 和 [abc]的可视化表达如下

d


比如如下例子:


/abc/g 只匹配字符串“abc”,而/[abc]/g则匹配符合a,b,c一类的字符


^ 表示反向类或者非类

比如/[abc]/g匹配符合a,b,c一类的字符,/[^abc]/g匹配不符合a,b,c一类的字符



2 范围类

[a-z]表示从a到z的任意字符,这是个闭区间,包含a和z 本身

例子如下


范围类可以连写,比如[a-zA-Z]



这里讲一个知识点,如果我想匹配- 怎么办呢?

如果横线- 在两个字符中间,则表示范围,如果不在两字符中间,则表示-本身。例子如下



3 预定义类

以上字符类和范围类已经很方便的简化了我们正则表达式的书写,但正则表达式还提供了一系列预定义类来匹配常见的字符类

如下



字符
等价类含义
.[^\r\n]除了回车和换行符之外的所有字符
\d[0-9]数字字符
\D[^0-9]非数字字符
\s[\t\n\x0B\f\r]空白符
\S[^\t\n\x0B\f\r]非空白符
\w[a-zA-Z_0-9]单词字母(字母,数字,下划线)
\W[^a-zA-Z_0-9]非单词字母

举个例子吧,比如我们想匹配一个 ab + 数字 + 任意字符 的字符串

参照以上预定义类 即: ab\d.  就可以了

4 边界

刚刚已经讲过一个单词边界\b 了,还有其他几个,如下

^  : 以XXX开始

$ :以XXX结束

\b : 单词边界

\B : 非单词边界

\b \B的例子如下


^ 以XXX为开始的,写在所匹配字符的前面。$以XXX为结束的,写在所匹配字符的后面。例子如下


5 量词

比如说我们要匹配一个连续出现20次的字符,那么根据刚刚学过的正则表达式则应该写成:\d\d\d\d\d\d\d\d\d\d\d\d\d\d\d\d\d\d\d\d

显然太麻烦了 所以量词现在该上场了

JS中有几个定义好的量词 如下:

?           出现0次或1次(最多出现一次)

+           出现一次或多次(至少出现一次)

*           出现0次或多次(任意次)

{n}        出现n次

{n-m}   出现n-m次

{n,}       至少出现n次

所以刚刚的表达式可以写成 \d{20}



6 分组 ()用于分组

我们经常会遇到如下一个场景,比如说匹配一个字符串出现3次的场景 比如匹配hello出现3次以上的场景

学过量词后我们会以为正则应该写成这样hello{3}.但hello{3}是表示的如图含义


也就是说hello{3}匹配的是 hellooo

那么现在就需要将hello用()进行分组

 

举个例子吧  在a111b2c3d4分别替换出现一个字母三个数字  和  连续出现一个字母一个数字三次 的字符


正则中用| 来达到或的效果



分组中还有个比较常用的功能是反向引用

给个常用的场景吧,把 年-月-日 替换成 月/日/年  

例如 把2017-02-16 替换成 02/16/2017的形式

这就用到了分组的功能 我们分别把年月日分组后重新组合

$代表分组后的内容

如下




7  正则表达式的前瞻和后顾

因为正则表达式是从文本头部向文本尾部开始解析,所以文本尾部方向称为前 文本头部称作后

前瞻就是在正则表达式匹配到规则的时候,向前检查是否符合断言,后顾的方向则相反

比如说要替换 a1ba@3$4 中字符后面带有数字的字符







 



















[\r\n\x0B\f\r]
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值