2025第1周 | JavaScript中的正则表达式

server/2025/1/8 19:34:32/

目录

  • 1. 正则表达式是个什么东东?
    • 1.1 怎么定义正则
    • 1.2 对象字面量方式
    • 1.3 类创建方式
  • 2. 怎么使用
    • 2.1 实例方法
      • 2.1.1 exec方法
      • 2.1.2 test方法
    • 2.2 字符串中的方法
      • 2.2.1 match/matchAll
      • 2.2.2 replace/replaceAll
      • 2.2.3 split
      • 2.2.4 search
  • 3. 规则
    • 3.1 修饰符
    • 3.2 字符类
    • 3.3 锚点(Anchors)
    • 3.4 转义字符串
    • 3.5 集合(Sets)和范围(Ranges)
    • 3.6 量词
    • 3.7 捕获组
    • 3.8 贪婪模式和惰性模式

2025,做想做的事,读想读的书,持续学习,自律生活,修行人生。

2025一个转身就已到来,对于时间太快,总会有种惶恐感。每每回首过去,总会发现想要做的事情没有完成,学习的内容少之又少,读的有用的书籍更是可以忽略不计。对于内在的超越,内在的修行也是没有始终践行,知行合一,实践、认识、再实践、再认识…

2025年第1周:2025.01.01 ~ 2025.01.05

目标:JavaScript中的正则表达式,您搞懂了么?这部分内容,不需要深入了了解,但是基本的概念和用法需要掌握。

1. 正则表达式是个什么东东?

我们看一下百度百科上的解释:

正则表达式Regular Expression):又称规则表达式,在代码中常简写为regexregexpRE正则表达式使用单个字符串来描述、匹配一系列匹配某个句法规则的字符串,通常被用来检索、替换那些符合某个模式(规则)的文本。许多程序设计语言都支持利用正则表达式进行字符串操作。

读了半天,还是懵,说的什么东东?

其实就一句话:在JavaScript中,就是用来进行字符串匹配的,进行搜索、获取、替代字符串

1.1 怎么定义正则

那么,怎么定义正则呢?有两种方式来定义正则:

  1. 对象字面量方式(常用)
  2. 使用类RegExp创建

正则有两部分构成:模式、和修饰符。

1.2 对象字面量方式

  • 这里面xxx:为模式
  • ig:为修饰符
javascript">// 对象字面量方式创建正则
const regexp = /xxx/ig

1.3 类创建方式

  • 使用RegExp 类来创建
javascript">const regexp = new RegExp("xxx", "ig")

2. 怎么使用

有了正则表达式之后,我们要如何使用它呢? 在JavaScript中,主要用于以下两个场景:

  1. RegExp的实例方法:exec、和 test 方法
  2. 字符串的方法:match/matchAllreplace/replaceAllsearchsplit 方法。

2.1 实例方法

2.1.1 exec方法

  • exec方法:使用正则,执行一个字符串。
javascript">const re1 = /qtz/ig; 
const message = "welcom to qtz";const result = re1.exec(message);
console.log(result);// [ 'qtz', index: 10, input: 'welcom to qtz', groups: undefined ]

2.1.2 test方法

test方法:检测某一个字符串是否符合正则的规则。返回boolean类型。

javascript">const regexp = /qtz/ig
const str = "welcome to qtz"
if (regexp.test(str)) {console.log("匹配到了qtz")
}

2.2 字符串中的方法

2.2.1 match/matchAll

  • 注意:matchAll传入的正则修饰符,必须加g,否则会报如下错误:
javascript">Uncaught TypeError: String.prototype.matchAll called with a non-global RegExp argument
  • matchAll 返回值:得到是一个迭代器对象(RegExpStringIterator{})
javascript">const re = /qtz/ig; 
const message = "Qtz and qtz or qtz";const result = message.matchAll(re);console.log(result.next()); 
console.log(result.next());
console.log(result.next());

2.2.2 replace/replaceAll

  • 替换字符串
javascript">const re1 = /qtz/ig; 
const message = "Qtz and qtz or qtz";const result = message.replace(re1, "AAA");
console.log(result);    // AAA and AAA or AAA

2.2.3 split

  • 字符串分割
javascript">const reg = /qtz/ig; 
const message = "Qtz and qtz or qtz";const result = message.split(reg);
console.log(result);   // [ '', ' and ', ' or ', '' ]

2.2.4 search

  • 查找字符串
javascript">const reg = /qtz/i; 
const message = "HH Qtz and qtz or qtz";const result = message.search(reg);
console.log(result);  // 3

3. 规则

3.1 修饰符

  • g:全局,匹配所有
  • i:忽略大小写
  • m:多行匹配

3.2 字符类

字符类(Character classes)是一个特殊的符号,匹配特定集中的任何符号:

  • \d :数字从0到9的字符
  • \s:空格符号,包括空格、制表符 \t、换行符\n 和其他少数稀有字符,例如 \v\f\r
  • \w:'单字"字符,拉丁字母、数字、下划线-。相当于 [ a-zA-Z0-9_ ]
  • .(点):点 . 是一种特殊字符类,它与“除换行符之外的任何字符”匹配.

反向类(Inverse classes)

  • \D 非数字:除 \d 以外的任何字符,例如字母,
  • \S 非空格符号:除\s 以外的任何字符,例如字母。
  • \W 非单字字符:除 \w 以外的任何字符,例如非拉丁字母或空格,

3.3 锚点(Anchors)

符号^和符号 $正则表达式中具有特殊的意义,它们被称为“锚点”。

  • 符号 ^ 匹配文本开头;
  • 符号 $ 匹配文本末尾,

词边界(Word boundary)

  • 词边界 \b 是一种检査,就像 ^$ 一样,它会检査字符串中的位置是否是词边界。
  • 词边界测试 \b 检査位置的一侧是否匹配 \w,而另一侧则不匹配“\w“

3.4 转义字符串

如果要把特殊字符作为常规字符来使用,需要对其进行转义

  • 只需要在它前面加个反斜杠 \

常见的需要转义的字符:

javascript">[ ] \ ^ $ . | ? * + ( )
  • 斜杠符号 / 并不是一个特殊符号,但是在字面量正则表达式中也需要转义;
javascript">const re = /\//

3.5 集合(Sets)和范围(Ranges)

有时候我们只要选择多个匹配字符其中之一就可以:

  • 在方括号 [...] 中的几个字符或者字符类意味着“搜索给定的字符中的任意一个”.

集合(Sets)

  • 比如说,[eao] 意味着查找在3个字符’a’、'e’或者、'o’中的任意一个;

范围(Ranges):方括号也可以包含字符范围

  • 比如说,[a-z]会匹配从 a到z范围内的字母,[0-5]表示从05的数字;
  • [0-9A-F]表示两个范围:它搜索一个字符,满足数字 0 到 9 或字母 A 到 F
  • \d :和 [0-9]相同;
  • \w:和 [a-zA-Z0-9_]相同;

3.6 量词

用来形容我们所需要的数量的词被称为量词(quantifiers)。

数量 {n}

  • 确切的位数:{5}
  • 某个范围的位数:{3,5} 注意,号后面不能有空格

简写:

  • +:代表“一个或多个”,相当于{1,}
  • ?:代表“零个或一个”,相当于(0,1}。换句话说,它使得符号变得可选;
  • *:代表着“零个或多个”,相当于{0,}。也就是说,这个字符可以多次出现或不出现;

3.7 捕获组

  1. 模式的一部分可以用括号括起来(.),这称为“捕获组。这有两个作用:
  • 它允许将匹配的一部分作为结果数组中的单独项,
  • 它将括号视为一个整体;
  1. 命名组:
  • 用数字索引记录组很困难。
  • 对于更复杂的模式,计算括号很不方便。我们有一个更好的选择:给括号起个名字。
  • 这是通过在开始括号之后立即放置?<name>来完成的。
  1. 非捕获组:
  • 有时我们需要括号才能正确应用量词,但我们不希望它们的内容出现在结果中
  • 可以通过在开头添加 ?:来排除组。
  • 正则表达式中,它用竖线|表示,
  • 通常会和捕获组一起来使用,在其中表示多个值
  • [aeo]的区别:中括号是单个字符

3.8 贪婪模式和惰性模式

默认情况下的匹配规则:是查找到匹配的内容后,会继续向后查找,一直找到最后一个匹配的内容

  • 这种匹配的方式,我们称之为贪婪模式

懒性模式中的量词与贪婪模式中的是相反的。

  • 只要获取到对应的内容后,就不再继续向后匹配
  • 我们可以在量词后面再加一个问号?来启用它
  • 所以匹配模式变为 *?+?,甚至将?变为 ??

END !


http://www.ppmy.cn/server/156565.html

相关文章

依据多波段栅格数据进行建筑统计操作(基于ArcGIS操作)

1 操作软件 ArcMap 10.8&#xff08;3.1&#xff09; ArcGIS Pro&#xff08;3.2和3.3&#xff09; 2 操作任务 3 操作步骤 3.1 将影像数据进行分割&#xff08;即输出每一单波段影像数据&#xff09; 预处理工作&#xff1a;由于时序人口的栅格数据空间范围远大于待提取的…

计算机网络第五章--运输层--课后习题

1.连续ARQ协议 【5-21】 假定使用连续ARQ 协议&#xff0c;发送窗口大小是3,而序号范围是[0,15],而传输媒 体保证在接收方能够按序收到分组。在某一时刻&#xff0c;在接收方&#xff0c;下一个期望收到的 序号是5。试问&#xff1a; (1)在发送方的发送窗口中可能出现的序号组…

Tailwind CSS 实战:动画效果设计与实现

在现代网页设计中,动画效果就像是一位优秀的舞者,通过流畅的动作为用户带来愉悦的视觉体验。记得在一个产品展示网站项目中,我们通过添加精心设计的动画效果,让用户的平均停留时间提升了 35%。今天,我想和大家分享如何使用 Tailwind CSS 打造优雅的动画效果。 设计理念 设计动…

如何进一步提高Oracle lgwr的写性能?

今天在我们的一个项目中&#xff0c;客户非常关系Oracle的log file sync、db file parallel write性能。 由于我们的分布式存储zdatax已经是nvme了&#xff0c;因此db file parallel write的性能足够好了&#xff0c;平均等待时间也就0.13ms。 然后log file sync 确高达0.6ms…

redis解决高并发抢购

对于前后端不分离的程序可以用悲观锁&#xff0c;对于前后端分离的程序可以用redis分布式锁 分布式锁 setnx key value&#xff0c;将key设置为value&#xff0c;当键不存在时&#xff0c;才能成功&#xff0c;若键存在&#xff0c;什么也不做&#xff0c;成功返回1&#xff0…

NebulaGraph学习笔记-自定义SessionPool

最近看了一下NebulaGraph图数据库连接的部分资料&#xff0c;发现还可以通过SessionPool的方式连接。下面是一个简单的DEMO记录。 组件项目 相关依赖包 <!-- SpringBoot依赖包 --> <dependency><groupId>org.springframework.boot</groupId><art…

ubuntu 22下解决Unment dependencies问题

问题现象 在使用apt安装包的时候&#xff0c;出现如下错误&#xff1a; 解决方案 第一步 sudo apt-get -f install sudo apt-get update sudo apt-get upgrade第二步 sudo apt-get update sudo apt-get clean sudo apt-get autoremove第三步 sudo apt --fix-broken inst…

行政审批远程勘验管理系统(源码+文档+部署+讲解)

引言 在快速发展的现代社会&#xff0c;远程踏勘系统作为一项创新技术&#xff0c;正逐渐改变传统的现场勘察工作模式。本文将详细介绍远程踏勘系统的核心功能、技术优势以及它如何提升现场勘察的效率。 系统概述 远程踏勘系统采用前后端分离的架构设计&#xff0c;服务端基…