JavaScript中的正则表达式解析(一)——数字的匹配

前言

说到让人头疼的,莫过于正则表达式了,谁能告诉我那一堆看起来像乱码的东西,到底匹配的是什么(抓狂脸!),不用心急,不用焦躁,下面我们就来彻底的了解一下正则表达式。——妈妈再也不用担心我看不懂正则表达式了。()。

是什么?

认识一个新事物的第一步——搞清楚它是什么。正则表达式是匹配字符串中字符组合的模式。首先,正则表达式是用于匹配字符串的,数组什么的靠边站,其次正则表达式就是一种模式,说白了就是和模式一样的,咱就匹配它,和模式不一样的咱理都不理。

怎么用?

创建一个正则表达式

有两种方式来创建一个正则表达式:

1、使用正则表达式的字面量

const reg1 = /ac+b/;

我们来解读一下,最外面是两个斜杠(采用这种方法来创建的话斜杠是必须有的),斜杠里面呢,就是模式组合(先甭管它是用来干嘛的)。这种方法来创建正则表达式的方式,是最简单,且当正则表达式保持不变时,其性能也是最好的。

2、调用RegExp对象的构造函数
就像字符串有String对象一样,正则表达式也有一个RegExp对象。我们可以利用这个对象来创建正则表达式,就像下面这样:

const reg1 = new RegExp("ac+b")

编写一个正则表达式

简单的模式匹配

如果你想匹配一个字符串中的123那么只需要像这样写——/123/即可,如果你想匹配字符串中的abc,就可以写成——/abc/。如果你想匹配到字符串中所有的123,那么只需要在模式的后面加上标志g即可——/123/g

使用特殊字符

除了这些简单的模式,更多的是一些很复杂的模式。我们可以通过正则表达式中的一些特殊字符的组合来实现。

一个非常常见的业务需求——检测用户输入的手机号码是否合法。此时我们就可以使用正则表达式进行匹配。

特殊字符\d是用来匹配字符串中的一个数字的。手机号码有13位数字,
我们可以这样来写匹配模式,来检测用户输入的是否是13位数字——/\d\d\d\d\d\d\d\d\d\d\d\d\d/。当然,这样写非常的繁琐,那有没有更简单的方式来编写呢?当然有!我们可以写成这样——/\d{13}/
这样是不是简便多了。

特殊字符{n},其中n是整数,用来匹配前一个表达式刚好发生了n次。像前面的/\d{13|/表示匹配连续的13个数字。当然也可以和字母组合,比如/a{2}/,表示匹配连续的两个a。

当然我们这样检测是不行的,当用户输入的是ABC1234567891232dbz时匹配也是成功的。因为,字符串中确实有13个数字。所以我们需要来改良我们的模式。

我们要匹配的模式是要以数字开头,有没有办法实现呢?当然!此时我们需要使用特殊字符——^^用来匹配输入的开始。我们把模式修改一下,变成这样——/^\d{13}/。这样,上面所说的字符串便不能被匹配到了。因为它是以字母开头,不是数字开头。那这样就行了吗?很遗憾这样也不行,当用户输入的是1234567891234abc时,仍然符合匹配模式,确实是以数字开头且连续13个数字。所以,我们需要进一步来改进我们的模式。

我们想要匹配以数字开始,且以数字结束,并且有13位数字。此时我们可以利用特殊字符——\$\$用来匹配输入的结束。把模式修改城这样——/^\d{13}$/。此时它的意思就是匹配以数字开始,且以数字结尾,并且有13位数字。那么上面那几种输入的字符串,都不会被匹配。

到这一步,我们确保了用户输入的是13位数字,但并不是13位数字的随机组合就是一个标准的手机号码。因此,下面我们需要对用户数入的这13 位数字进行检测。

我们都知道,手机号码的前两位组合无非就是[13,15,17,18]中的一个,那么我们如何把它运用到我们的模式中呢?

观察这里,手机号码都是以1开头,后面的第二位是[3,5,7,8]中的一个,其中3,5,7,8,是一个字符集,我们可以用()来把它给包围起来,但是第二位数字只需要是它们四个当中的其中一个就可以了,那么我们就使用|符。例如:x|y,就表示匹配x或者y。此时我们已经解决了最后一个问题。来让我们看一看最终的模式长什么样——/^1(3|5|7|8|)\d{11}$/

最终我们常用的匹配手机号的正则表达式就是这样了。

下面是正则表达式的一些特殊字符的表格:

特殊字符

特殊字符含义
{n}n 是一个正整数,匹配前面的一个字符刚好发生了n次,如果你想匹配字符串中连续的一串数字,那么就可以使用——/\d{n}/。
{n,m}n,m都是整数,表示匹配前面的一个字符最少n次,最多m次。
^匹配输入的开始。它可以这样使用——/^\d{4}/,它匹配“1234abc”中的‘1234’,但是不会匹配‘ABC1234’中的‘1234’。
$匹配输入的结束。它可以这样使用——/\d{4}$/。它匹配“ABC1234”中的“1234”,不匹配“1234ABC”中的“1234”
+匹配前面一个表达式一次或者多次。例如:/\d+/。它会匹配“ABC12346”中的“12346”
*匹配前面紧挨着的表达式0此或多次。例如,/bo*/会匹配 “A ghost boooooed” 中的 ‘booooo’ 和 “A bird warbled” 中的 ‘b’,但是在 “A goat grunted” 中将不会匹配任何东西。
?匹配前面一个表达式0此或者1次,相当于{0,1}。

匹配一些特殊字符

有的时候我们可能还会遇到检测电话号码,像这样的800-692-7053。电话号码并不像手机号码,它里面除了数字之外还有特殊字符——-。当我们用正则表达式检测时,该如何编写呢?

想要匹配特殊字符,我们需要在它前面加上\对其进行转义,将其变为字面量。比如匹配字符串中的*。我们可以写成/\*/。此时\*不再是一个特殊字符,而是变为了一个普通的字面量。这样就可以匹配到字符串中的特殊字符了。

知道了如何匹配特殊字符,那么对于上述的电话号码我们就可以编写模式了——/^\d{3}\-\d{3}\-\d{4}$/
如何还有其他的限制,那么根据刚刚讲述的编写方法,对其进行改进即可。

特殊字符的匹配表格

字符含义
\s匹配一个空白字符,包括空格、制表符、换页符和换行符
\t匹配一个水平制表符
\f匹配一个换页符
\n匹配一个换行符 (U+000A)
\r匹配一个回车符 (U+000D)
\v匹配一个垂直制表符 (U+000B)
\0匹配 NULL (U+0000) 字符, 不要在这后面跟其它小数
  • 4
    点赞
  • 16
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值