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) 字符, 不要在这后面跟其它小数 |
JavaScript中的正则表达式解析(一)——数字的匹配相关推荐
- JavaScript中的正则表达式解析
正则表达式(regular expression)对象包含一个正则表达式模式(pattern).它具有用正则表达式模式去匹配或代替一个字符串(string)中特定字符(或字符集合)的属性(proper ...
- 52 JavaScript中的正则表达式
技术交流QQ群:1027579432,欢迎你的加入! 欢迎关注我的微信公众号:CurryCoder的程序人生 1.什么是正则表达式 正则表达是(regular expression)是用于匹配字符串中 ...
- 十、JavaScript中的正则表达式(六)
@Author:Runsen @Date:2020/5/26 作者介绍:Runsen目前大三下学期,专业化学工程与工艺,大学沉迷日语,Python, Java和一系列数据分析软件.导致翘课严重,专业排 ...
- qq号的正则表达式html,JavaScript中的正则表达式使用及验证qq号码的正则
废话不多说了,直接给大家贴正则表达式代码了. function myValid() { var errorMsg = ""; var res = true; //拿到要验证的值. ...
- JavaScript中的预解析(变量提升)介绍!
今天小千为大家介绍一下JavaScript中的预解析(变量提升).从什么是预解析及变量的预解析和函数的预解析及加载流程进行学习(注意:我们这里说的ES5中的预解析). 什么是解析 首先代码执行肯定需要 ...
- Javascript中使用正则表达式进行数据验证
Javascript中使用正则表达式进行数据验证 <script language="javascript"> function checkMobile(mobile ...
- JavaScript中的正则表达式详解
正则表达式(Regular Expression)是一门简单语言的语法规范,是强大.便捷.高效的文本处理工具,它应用在一些方法中,对字符串中的信息实现查找.替换和提取操作. 正则表达式在人们的印象中可 ...
- JavaScript中变量判断是否是数字,判断是否是整数,判断是否是正整数/负整数,判断奇数/偶数的方法
(1)判断是否是整数 JavaScript中变量判断是否是数字,判断是否是整数,判断是否是正整数/负整数,判断奇数/偶数的方法. (1)判断是否是整数 // 判断整数function isInteg ...
- javascript中的正则表达式学习
一.前言 关于正则表达式自身的语法这里不做过多介绍(详情可参见http://www.php100.com/manual/unze.html),这里仅仅解释javascript中和正则表达式相关的几个方 ...
最新文章
- day22 案例 发送邮箱激活码 购物车 分析
- 布加迪、劳斯莱斯和宾利零售商开始接受BTC和BCH付款
- linux c++ 警告 warning: ISO C++ forbids converting a string constant to ‘char*‘ [-Wwrite-strings] 解决方法
- 文本信息检索基本知识【转】
- Kafka消息丢失、重复消费的解决方案
- 【Homework】银行存取款业务
- vue-awesome-swiper使用
- 自定义 ocelot 中间件输出自定义错误信息
- [原]调试实战——程序CPU占用率飙升,你知道如何快速定位吗?
- 佳鑫诺计算机模拟卷答案,微机原理练习册答案佳鑫诺).docx
- 在php里面找出有用的代码,如何在多个源代码文件中 找到某段代码?
- UnityGI2:Lightmaps
- C++智能指针的几种用法
- 李航老师《统计学习方法》第二版第十一章课后习题答案
- php计算指数函数,指数函数运算法则公式有哪些
- usbos在服务器上不能引导,USBOS V3.0.2021.07.10
- win11资源管理器总是自动重启的解决方法
- 数字人民币来了!它与支付宝、微信有什么区别吗?
- Linux截图和屏幕视频录制软工具Kazam使用攻略
- 会员等级进度功能前端实现
热门文章
- 用SS5在Linux上搭建Socks5 Proxy代理服务器
- 12306——(三)在线订票助手工具源码
- 浏览器扩展 自动检测失效书签链接,一键清理
- 4k视频编辑台式计算机,字节跳动剪辑工具 “剪映”PC 版体验:支持 4K 视频分辨率...
- C++的sort函数实现字符串排序
- 程序员之死(系列)——续
- 大数据项目-1.安装虚拟机vm16+CentOs(三:修改ip地址)
- 小白的OpenGL3.3自学之路(3)OpenGL3.3之如何绘制一个三角形
- Linux ifconfig 不显示ip
- GDAL中通过GDALDriver类的Create函数实现图像的保存