Javascript 正则

基本语法

定义

JavaScript种正则表达式有两种定义方式

  1. 构造函数

    var reg=new RegExp('<%[^%>]+%>','g');
    
  2. 字面量

    var reg=/<%[^%>]%>/g;
    
  • g: global,全文搜索,默认搜索到第一个结果接停止
  • i:ingore case,忽略大小写,默认大小写敏感
  • m:multiple lines,多行搜索(更改^ 和$的含义,使它们分别在任意一行对待行首和行尾匹配,而不仅仅在整个字符串的开头和结尾匹配)

元字符

正则表达式让人望而却步以一个重要原因就是其转义字符太多了,组合非常之多,但是正则表达式的元字符(在正则表达式中具有特殊意义的专用字符,可以用来规定其前导字符)并不多

元字符:( [ { \ ^ $ | ) ? * + .

并不是每个元字符都有其特定意义,在不同的组合中元字符有不同的意义

预定义特殊字符

字符含义
\t水平制表符
\r回车符
\n换行符
\f换页符
\cX与X对应的控制字符(Ctrl+X)
\v垂直制表符
\0空字符

字符类

一般情况下正则表达式一个字符(转义字符算一个)对应字符串一个字符,表达式 ab\t 的含义是
在这里插入图片描述

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

可以使用表达式 [abc] 把字符a或b或c归为一类,表达式可以匹配这类的字符
在这里插入图片描述

元字符***[]组合可以创建一个类***,还可以使用元字符 ^创建反向类/负向类,反向类的意思是不属于XXX类的内容,表达式 [^abc]表示不是字符a或b或c的内容

在这里插入图片描述

范围类

正则表达式还提供了范围类,可以使用 x-y来连接两个字符表示从x到y的任意字符,这是个闭区间,也就是说包含x和ybenshen,这样匹配小写字母就很简单了

[a-z] 在这里插入图片描述

要是想匹配所有字母呢?在[]组成的类内部是可以连写的,我们还可以这样写 [a-zA-Z]

在这里插入图片描述

预定义类

刚才使用正则创建了几个类,来表示数字,字母等,但这样写也很是麻烦,正则表达式为我们提供了几个常用的预定义类来匹配常见的字符

字符等价类含义
.[^\n\r]除了回车符和换行符之外的所有字符
\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.在这里插入图片描述

边界

正则表达式还提供了几个常用的边界匹配字符

字符含义
^以xx开头
$以xx结尾
\b单词边界,指[a-zA-Z_0-9]之外的字符
\B非单词边界

看个不负责任的邮箱正则匹配 :\w+@\w+\.(com)$
在这里插入图片描述

量词

正则表达式引入了一些量词,用于匹配连续出现的配项,如果希望匹配一个连续出现20次数字的字符串我们可以写成这样 \d[20]

字符含义
?出现零次或一次(最多出现一次)
+出现一次或多次(至少出现一次)
*出现零次或多次(任意次)
{n}出现n次
{n,m}出现n到m次
{n,}至少出现n次

看几个使用量词的例子

// \w+\b Byron 匹配 单词+边界+Byron
(/\w+\b Byron/).test('Hi Byron'); //true
(/\w+\b Byron/).test('Welcome Byron'); //true
(/\w+\b Byron/).test('HiByron'); //false

\d+.\d{1,3} 匹配三位小数的数字

在这里插入图片描述

贪婪于非贪婪

比如{3,5}这个量词,要是在句子种出现了十次,那么他是每次匹配三个还是五个,反正3、4、5都满足3~5的条件,量词在默认下是尽可能多的匹配的,也就是常说的贪婪模式

'123456789'.match(/\d{3,5}/g); //["12345", "6789"] 

既然有贪婪模式,那么肯定会有非贪婪模式,让正则表达式尽可能少的匹配,也就是说一旦成功匹配不不再继续尝试,做法很简单,在量词后加上 ? 即可

'123456789'.match(/\d{3,5}?/g); //["123", "456", "789"]

分组

有时候我们希望使用量词的时候匹配多个字符,而不是像上面例子只是匹配一个,比如希望匹配Byron出现20次的字符串,我们如果写成 Byron{20} 的话匹配的是Byro+n出现20次,怎么把Byron作为一个整体呢?使用()就可以达到次目的,我们称为分组:

(Byron){20}在这里插入图片描述

如果希望匹配Byron或Casper出现20次该怎么办呢?可以使用字符 | 达到或的功效:

(Byron|Casper){20} 在这里插入图片描述

使用分组的正则表达式会把匹配项也放到分组中,默认就是按数字编号分发的,各异根据编号获得捕获的分组内容,这个在一些希望具体操作第几个匹配项的函数中很有用

(Byron).(ok)在这里插入图片描述

如果有分组嵌套的情况,外面的组的编号靠前

((^|%>)[^\t]*)在这里插入图片描述

有时候我们不希望捕获某些分组,只需要在分组内加上 ?: 就可以了,着并不意味着该分组内容不属于正则表达式,只是不会给这个分组加编号了而已

(?:Byron).(ok)在这里插入图片描述

其实在C#等语言中分组还可以起名字,不过JavaScript不支持

前瞻

表达式含义
exp1(?=exp2)匹配后面是exp2的exp1
exp1(?!exp2)匹配后面不是exp2的exp1

说的有些抽象,看个例子 good(?=Byron)
在这里插入图片描述

(/good(?=Byron)/).exec('goodByron123'); //['good']
(/good(?=Byron)/).exec('goodCasper123'); //null
(/bad(?=Byron)/).exec('goodCasper123');//null

后顾

表达式含义
(?<=exp1)exp2匹配前面是exp1的exp2
(?<!exp1)exp2匹配前面不是exp1的exp2

前瞻类似,只是一个前、一个后(从左向右是前

相关方法

RegExp实例的几个属性

在这里插入图片描述

  1. global:是否全局搜索,默认是false

  2. ignoreCase:是否大小写敏感,默认是false

  3. multiline:多行搜索,默认值是false

  4. lastIndex:是当前表达式模式首次匹配内容中最后一个字符的下一个位置,每次正则表达式成功匹配时,lastIndex属性值都会随之改变。

  5. source:正则表达式的文本字符串

除了将正则表达式编译为内部格式从而使执行更快的compile()方法,对象还有两个我们常用的方法

regObj.test(strObj)

方法用于测试字符串参数中是否存正则表达式模式,如果存在则返回true,否则返回false

var reg=/\d+\.\d{1,2}$/g;reg.test('123.45'); //true
reg.test('0.2'); //truereg.test('a.34'); //false
reg.test('34.5678'); //false

regObj.exec(strObj)

方法用于正则表达式模式在字符串中运行查找,如果 exec() 找到了匹配的文本,则返回一个结果数组。否则,返回 null。除了数组元素和 length 属性之外,exec() 方法还返回两个属性。index 属性声明的是匹配文本的第一个字符的位置。input 属性则存放的是被检索的字符串 string。

调用非全局的 RegExp对象的 exec() 时,返回数组的第 0 个元素是与正则表达式相匹配的文本,第 1 个元素是与 RegExpObject 的第 1 个子表达式相匹配的文本(如果有的话),第 2 个元素是与 RegExp对象的第 2 个子表达式相匹配的文本(如果有的话),以此类推。

调用全局的RegExp对象的 exec() 时,它会在 RegExp实例的 lastIndex 属性指定的字符处开始检索字符串 string。当 exec() 找到了与表达式相匹配的文本时,在匹配后,它将把 RegExp实例的 lastIndex 属性设置为匹配文本的最后一个字符的下一个位置。可以通过反复调用 exec() 方法来遍历字符串中的所有匹配文本。当 exec() 再也找不到匹配的文本时,它将返回 null,并把 lastIndex 属性重置为 0。

var reg=/\d/g;
var r=reg.exec('a1b2c3'); 
console.log(reg.lastIndex); //2
r=reg.exec('a1b2c3');
console.log(reg.lastIndex); //4

两次执行r的结果:

在这里插入图片描述在这里插入图片描述

var reg=/\d/g;
while(r=reg.exec('a1b2c3')){console.log(r.index+':'+r[0]);
}
// 看到的结果:
// 1:1
// 3:2
// 5:3

除了上面的两个方法,有些字符串函数可以传入RegExp对象作为参数,进行一些复杂的操作

strObj.search(RegObj)

search() 方法用于检索字符串中指定的子字符串,或检索与正则表达式相匹配的子字符串。search() 方法不执行全局匹配,它将忽略标志 g。它同时忽略 regexp 的 lastIndex 属性,并且总是从字符串的开始进行检索,这意味着它总是返回 stringObject 的第一个匹配的位置。

'a1b2c3'.search(/\d/g); //1
'a1b2c3'.search(/\d/); //1

strObj.match(RegObj)

match() 方法将检索字符串 stringObject,以找到一个或多个与 regexp 匹配的文本。但regexp是否具有标志 g对结果影响很大。

如果 regexp 没有标志 g,那么 match() 方法就只能在 strObj 中执行一次匹配。如果没有找到任何匹配的文本, match() 将返回 null。否则,它将返回一个数组,其中存放了与它找到的匹配文本有关的信息。该数组的第 0 个元素存放的是匹配文本,而其余的元素存放的是与正则表达式的子表达式匹配的文本。除了这些常规的数组元素之外,返回的数组还含有两个对象属性。index 属性声明的是匹配文本的起始字符在 stringObject 中的位置,input 属性声明的是对 stringObject 的引用。

var r='aaa123456'.match(/\d/); 

在这里插入图片描述

如果 regexp 具有标志 g,则 match() 方法将执行全局检索,找到 strObj 中的所有匹配子字符串。若没有找到任何匹配的子串,则返回 null。如果找到了一个或多个匹配子串,则返回一个数组。不过全局匹配返回的数组的内容与前者大不相同,它的数组元素中存放的是 strObj 中所有的匹配子串,而且也没有 index 属性或 input 属性。

var r='aaa123456'.match(/\d/g);

在这里插入图片描述

strObj.replace(regObj,replaceStr)

关于strng对象的replace方法,我们最常用的时传入两个字符串的做法,但这种做法有个缺陷,只能replace一次

'abcabcabc'.replace('bc','X'); //aXabcabc

replace方法的第一个参数还可以传入RegExp对象,传入正则表达式可以时replace方法更加强大灵活

'abcabcabc'.replace(/bc/g,'X'); //aXaXaX
'abcaBcabC'.replace(/bc/gi,'X'); //aXaXaX

如果replace方法的第一个参数传入的是带分组的正则表达式,我们在第二个参数中可以使用$1…$9来获取相应分组内容,比如希望把字符串 1<%2%>34<%567%>89 的<%x%>换为$#x#$,我们可以这样

'1<%2%>34<%567%>89'.replace(/<%(\d+)%>/g,'@#$1#@');
//"1@#2#@34@#567#@89"

当然还有很多方式可以达到这一目的,这里只是演示一下利用分组内容,我们在第二个参数中使用 @#$1#@,其中$1表示被捕获的分组内容,在一些js模板函数中可以经常见到这种方式替换字符串。

strObj.split(regObj)

我们经常使用split方法把字符串分割为字符数组

'a,b,c,d'.split(','); //["a", "b", "c", "d"]

和replace方法类似,在一些复杂的分割情况下我们可以使用正则表达式解决

'a1b2c3d'.split(/\d/); //["a", "b", "c", "d"]

这样就可以按照数字分割字符串了

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/30219.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

接口自动化测试框架及接口测试自动化主要知识点

接口自动化测试框架&#xff1a; 接口测试框架&#xff1a;使用最流行的Requests进行接口测试接口请求构造&#xff1a;常见的GET/POST/PUT/HEAD等HTTP请求构造 接口测试断言&#xff1a;状态码、返回内容等断言JSON/XML请求&#xff1a;发送json\xml请求JSON/XML响应断言&…

绝了!工业配电柜看这篇就够了!

随着工业自动化的不断发展&#xff0c;电力作为生产的重要支撑&#xff0c;其稳定性、安全性和高效性变得尤为重要。 配电柜作为电力系统的核心组成部分&#xff0c;其监控不仅关乎生产的连续性&#xff0c;也涉及员工和设备的安全。通过实时监测、数据采集和分析&#xff0c;工…

Linux 上安装部署Nacos

标题&#xff1a;在Linux上安装和部署Nacos Nacos是一个开源的分布式服务发现和配置管理平台&#xff0c;它可以帮助开发人员实现微服务架构中的服务注册、发现和动态配置管理。 步骤1&#xff1a;准备工作 在开始安装Nacos之前&#xff0c;确保您已经具备以下条件&#xff1…

Mongoose http server 例子

今天抽了点时间看了一下 mongoose的源码&#xff0c; github 地址&#xff0c;发现跟以前公司内部使用的不太一样&#xff0c;这里正好利用其 http server 例子来看一下。以前的 http message 结构体是这样的&#xff1a; /* HTTP message */ struct http_message {struct mg_…

css的transform样式计算-第一节

本文作者为 360 奇舞团前端开发工程师 引言 在使用 css 样式进行样式的缩放、旋转等设置时&#xff0c;思考了一下它的较浅层的原理&#xff0c;恩&#xff0c;这个阶段都 是一些初高的数学计算&#xff0c;从新看这里的时候顺便捡了捡初高中的数学&#xff0c;比如三角函数之类…

CSS:盒子模型 与 多种横向布局方法

目录 盒子模型块级盒子内联级盒子内联块级盒子弹性盒子display 改变模型区域划分text 内容区padding 填充区border 边框区margin 外边距直接设置盒子大小 布局横向布局方法一 float 浮起来方法二 内联块级元素实现方法三 弹性盒子模型 盒子模型 块级盒子 独占一行&#xff0c…

React中使用mobx管理状态数据使用样例

MobX 是一个身经百战的库&#xff0c;它通过运用透明的函数式响应编程&#xff08;Transparent Functional Reactive Programming&#xff0c;TFRP&#xff09;使状态管理变得简单和可扩展。官网地址&#xff1a;关于 MobX | MobX中文文档 | MobX中文网 安装依赖 mobx-react-…

QT的信号槽的四种写法和五种链接方式

目录 四种信号槽写法&#xff1a; 五种连接方式&#xff1a; 实例&#xff1a; 常见错误及改正&#xff1a; 错误1: 未连接信号与槽 错误2: 信号和槽参数不匹配 错误3: 未使用Q_OBJECT宏 错误4: 跨线程连接未处理 在Qt中&#xff0c;信号&#xff08;Signal&#xff09…

openEuler-OECA考试报名火热开启,尊享半价优惠 作者:HopeInfra 发布时间:2023-08-10

近日&#xff0c;润和软件人才评定报名系统已成功上线运行&#xff0c;现openEuler-OECA人才评定考试报名优惠活动火热开启&#xff0c;欢迎大家报名咨询&#xff01; 关于openEuler人才评定 随着openEuler及其发行版本在各个行业使用量逐年增多&#xff0c;相关人才的评定诉求…

突破笔试:力扣129. 求根节点到叶节点数字之和

1. 题目链接&#xff1a;129. 求根节点到叶节点数字之和 给你一个二叉树的根节点 root &#xff0c;树中每个节点都存放有一个 0 到 9 之间的数字。每条从根节点到叶节点的路径都代表一个数字&#xff1a;例如&#xff0c;从根节点到叶节点的路径 1 -> 2 -> 3 表示数字 …

http相关知识点

文章目录 长链接http周边会话保持方案1方案2 基本工具postmanFiddlerFiddler的原理 长链接 一张网页实际上可能会有多种元素组成&#xff0c;这也就说明了网页需要多次的http请求。可由于http是基于TCP的&#xff0c;而TCP创建链接是有代价的&#xff0c;因此频繁的创建链接会…

大数据Flink(五十六):Standalone伪分布环境(开发测试)

文章目录 Standalone伪分布环境(开发测试) 一、架构图 二、环境准备 三、下载安装包</

微信小程序 map地图(轨迹)

allMarkers效果图 废话少说直接上马&#xff08;最后是我遇到的问题&#xff09; cover-view是气泡弹窗&#xff0c;可以自定义弹窗&#xff0c;要配合js&#xff1a;customCallout&#xff0c;如果是非自定义的话&#xff1a;callout&#xff08;可以修改颜色、边框宽度、圆角…

java输出GB2312、GBK、GB18030、UTF-8所有的字符

相关文章 【转】彻底搞明白 GB2312、GBK 、GB18030和UTF-8 1.ASICII、GB2312、GBK、GB18030 以及 UTF8 的关系 2.编写代码 引入依赖&#xff1a;hutool工具类 <dependency><groupId>cn.hutool</groupId><artifactId>hutool-all</artifactId>&…

轻松批量自定义重命名,为文件夹加上个性化编号!

在日常生活和工作中&#xff0c;我们经常需要对大量的文件夹进行重命名&#xff0c;以更好地管理和整理文件。然而&#xff0c;手动逐个修改文件夹名称费时费力&#xff0c;效率低下。现在&#xff0c;我们为您推荐一款简单易用的工具&#xff0c;可以帮助您快速批量自定义重命…

LoRaWAN网关与网络服务器(NS)的通信CUPS 协议介绍

LoRa Basics™ Station 定期查询 CUPS 服务器以获取更新。该协议是 HTTP/REST,使用Credentials中描述的客户端/服务器身份验证方法。对于每个查询,工作站都会提供有关其当前状态的信息,并接收包含其 LNS 和 CUPS 凭证更新的二进制 blob,以及具有任意更新的通用数据段。 通…

网络安全的相关知识点

网络安全威胁类型&#xff1a; 1.窃听&#xff1a;广播式网络系统。 2.假冒 3.重放&#xff1a;重复一份报文或者报文的一部分&#xff0c;以便产生一个被授权的效果。 4.流量分析 5.数据完整性破坏 6.拒绝服务 7.资源的非授权使用 8.陷门和特洛伊木马&#xff1a;木马病毒有客…

Java课题笔记~ Spring 的事务管理

一、Spring 的事务管理 事务原本是数据库中的概念&#xff0c;在 Dao 层。但一般情况下&#xff0c;需要将事务提升到业务层&#xff0c;即 Service 层。这样做是为了能够使用事务的特性来管理具体的业务。 在 Spring 中通常可以通过以下两种方式来实现对事务的管理&#xff…

花样滑冰选手骨骼点动作识别

2023 CCF BDCI 基于飞桨实现花样滑冰选手骨骼点动作识别 16名方案以及总结 比赛任务 花样滑冰与其他运动项目相比&#xff0c;其动作类型的区分难度更大&#xff0c;这对识别任务来说是极大的挑战。对于花样滑冰动作识别任务&#xff0c;主要难点如下&#xff1a; (1) 花样滑…

Python-OpenCV中的图像处理-图像梯度

Python-OpenCV中的图像处理-图像梯度 图像梯度Sobel 算子和 Scharr 算子Laplacian 算子 图像梯度 图像梯度&#xff0c;图像边界等使用到的函数有&#xff1a; cv2.Sobel()&#xff0c; cv2.Scharr()&#xff0c; cv2.Laplacian() 等原理&#xff1a;梯度简单来说就是求导。Op…