JavaScript中,正则表达式所涉及的api,解析、实例和总结

JS中正则的api包括以下:

  • String#search
  • String#split
  • String#match
  • String#replace
  • RegExp#test
  • RegExp#exec

1. String#search

查找输入串中第一个匹配正则的index,如果没有匹配的则返回-1。g修饰符对结果无影响

var string = "abbbcbc";
var regex = /bc/g;
console.log(string.search(regex));
console.log(!!~string.search(regex));//log
3
true
var regex = /bcd/g;
console.log(string.search(regex));
console.log(!!~string.search(regex));//log
-1
false

扩展:使用 !!~ 的话,如果为 -1 则会得到 false;除此以外得到的都是 true

2. String#split

匹配上正则后,可以使用正则对输入串进行切分,得到一个字符串数组;如果没有匹配成功,则返回一个由原输入串组成的一个元素的字符串数组。g修饰符对结果无影响

var regex = /\D/;
console.log("2017/06/26".split(regex));
console.log("2017.06.26".split(regex));//log
[ '2017', '06', '26' ]
[ '2017', '06', '26' ]
var regex = /,/;
console.log("2017/06/26".split(regex));//log
[ '2017/06/26' ]

它可以有第二个参数,表示结果数组的最大长度,可以避免被错误分割

3. String#match

查找输入串中,匹配正则的部分。

其受g修饰符的影响,不带g的话,只会查找第一个匹配正则的子串,但得到的信息较多:第1个参数为匹配到的子串;第2个参数开始是匹配到的分组内容,如果有多个分组,就会有多个结果,可以没有;倒数第3个参数是匹配到的位置index;倒数第2个参数是输入串的内容;最后一个未知

var regex = /a(b{2,5})c/;
var string = "abc abbc abbbc abbbbc abbbbbc abbbbbbc";
console.log(string.match(regex));//log
['abbc','bb',index: 4,input: 'abc abbc abbbc abbbbc abbbbbc abbbbbbc',groups: undefined
]

带g的话,表示全局匹配,得到的是输入串中所有匹配的子串

var regex = /a(b{2,5})c/g;
var string = "abc abbc abbbc abbbbc abbbbbc abbbbbbc";
console.log(string.match(regex));//log
[ 'abbc', 'abbbc', 'abbbbc', 'abbbbbc' ]

当没有匹配时,不管有无 g,都返回 null

4. String#replace

replace可以将输入串中匹配到正则的子串,用替换物去替换掉。

可以分为两种用法:替换物为字符串、替换物从函数回调中得到:

4.1 替换物为字符串

其受g修饰符的影响,不带g的话,只会替换第一个匹配到的子串

var regex = /^|$/;
var replacement = '#';
var string = "hello";
var result = string.replace(regex, replacement);
console.log(result);//log
#hello

带g的话,会替换所有匹配到的子串

var regex = /^|$/g;
var replacement = '#';
var string = "hello";
var result = string.replace(regex, replacement);
console.log(result);//log
#hello#

替换物为字符串时,如下的字符有特殊的含义:
在这里插入图片描述

4.2 替换物从函数回调中得到

  • 每当输入匹配到一次正则时,就会回调一次函数。函数的返回值替换掉子串的内容,如果函数没有返回值则不替换。
  • 函数回调的参数:第1个为匹配整体内容,倒数第2个为index,倒数第1个为输入串,中间的按顺序依次为第1个分组、第2个分组、第3个分组的内容。

其也受g修饰符的影响,不带g的话,只会在第一次匹配到子串时回调函数

var regex = /(\d{4})-(\d{2})-(\d{2})/;
var string = "2017-06-12时间2024-03-18";
var result = string.replace(regex, function (match, year, month, day, index, input) {console.log(`match: ${match}, year: ${year}, month: ${month}, day: ${day}, index: ${index}, input: ${input}`);return month + "/" + day + "/" + year;
});
console.log(result);//log
match: 2017-06-12, year: 2017, month: 06, day: 12, index: 0, input: 2017-06-12时间2024-03-18
06/12/2017时间2024-03-18

带g的话,进行全局匹配,会在每一次匹配到子串时回调函数

var regex = /(\d{4})-(\d{2})-(\d{2})/g;
var string = "2017-06-12时间2024-03-18";
var result = string.replace(regex, function (match, year, month, day, index, input) {console.log(`match: ${match}, year: ${year}, month: ${month}, day: ${day}, index: ${index}, input: ${input}`);return month + "/" + day + "/" + year;
});
console.log(result);//log
match: 2017-06-12, year: 2017, month: 06, day: 12, index: 0, input: 2017-06-12时间2024-03-18
match: 2024-03-18, year: 2024, month: 03, day: 18, index: 12, input: 2017-06-12时间2024-03-18
06/12/2017时间03/18/2024

5. RegExp#test

判断输入串中,是否包含匹配正则的子串

其受g修饰符的影响,不带g的话,匹配的起始位置都是0

var regex = /\d+/;
console.log(regex.lastIndex, regex.test("123abc34def"));
console.log(regex.lastIndex, regex.test("123abc34def"));
console.log(regex.lastIndex, regex.test("123abc34def"));
console.log(regex.lastIndex, regex.test("123abc34def"));//log
0 true
0 true
0 true
0 true

带g的话,进行全局匹配,匹配的起始位置是从正则对象的 lastIndex 属性开始(第一次lastIndex为0)

var regex = /\d+/g;
console.log(regex.lastIndex, regex.test("123abc34def"));
console.log(regex.lastIndex, regex.test("123abc34def"));
console.log(regex.lastIndex, regex.test("123abc34def"));
console.log(regex.lastIndex, regex.test("123abc34def"));//log
0 true
3 true
8 false
0 true

6. RegExp#exec

查找输入串中,匹配正则的部分。包括以下信息:第1个参数为匹配到的子串;第2个参数开始是匹配到的分组内容,如果有多个分组,就会有多个结果,可以没有;倒数第3个参数是匹配到的位置index;倒数第2个参数是输入串的内容;最后一个未知

其受g修饰符的影响,不带g的话,匹配的起始位置都是0

var regex = /(\d)([a-z])/;
console.log(regex.lastIndex, regex.exec("123abc34def"));
console.log(regex.lastIndex, regex.exec("123abc34def"));
console.log(regex.lastIndex, regex.exec("123abc34def"));
console.log(regex.lastIndex, regex.exec("123abc34def"));//log
0 [ '3a', '3', 'a', index: 2, input: '123abc34def', groups: undefined ]
0 [ '3a', '3', 'a', index: 2, input: '123abc34def', groups: undefined ]
0 [ '3a', '3', 'a', index: 2, input: '123abc34def', groups: undefined ]
0 [ '3a', '3', 'a', index: 2, input: '123abc34def', groups: undefined ]

带g的话,进行全局匹配,匹配的起始位置是从正则对象的 lastIndex 属性开始(第一次lastIndex为0)

var regex = /(\d)([a-z])/g;
console.log(regex.lastIndex, regex.exec("123abc34def"));
console.log(regex.lastIndex, regex.exec("123abc34def"));
console.log(regex.lastIndex, regex.exec("123abc34def"));
console.log(regex.lastIndex, regex.exec("123abc34def"));//log
0 [ '3a', '3', 'a', index: 2, input: '123abc34def', groups: undefined ]
4 [ '4d', '4', 'd', index: 7, input: '123abc34def', groups: undefined ]
9 null
0 [ '3a', '3', 'a', index: 2, input: '123abc34def', groups: undefined ]

可以看出是否有g,对exec的打印结果内容无影响;但是有g时,String.match()就没有很多关键信息了(index,分组)
可以让 exec 配合 while 循环使用,全局匹配的同时,还能得到很多关键信息,两全其美!

var string = "2017.06.27";
var regex2 = /\b(\d+)\b/g;
var result;
while (result = regex2.exec(string)) {console.log(result, regex2.lastIndex);
}//log
[ '2017', '2017', index: 0, input: '2017.06.27', groups: undefined ] 4
[ '06', '06', index: 5, input: '2017.06.27', groups: undefined ] 7
[ '27', '27', index: 8, input: '2017.06.27', groups: undefined ] 10

7. 构造函数

  • 一般不推荐使用构造函数生成正则,而应该优先使用字面量。因为用构造函数会多写很多 \ ,很多字符都需要转义
  • 修饰符需要单独作为参数转入
var string = "2017-06-27 2017.06.27 2017/06/27";
var regex = /\d{4}(-|\.|\/)\d{2}\1\d{2}/g;
console.log( string.match(regex) );regex = new RegExp("\\d{4}(-|\\.|\\/)\\d{2}\\1\\d{2}", "g");
console.log( string.match(regex) );//log
[ '2017-06-27', '2017.06.27', '2017/06/27' ]
[ '2017-06-27', '2017.06.27', '2017/06/27' ]

8. 正则实例对象属性

global是否为全局匹配
ignoreCase是否忽略大小写
multiline是否多行匹配
lastIndex上次匹配位置
source构建的实际正则
var regex = new RegExp("(^|\\s)high(\\s|$)", "img");
console.log(regex.global);
console.log(regex.ignoreCase);
console.log(regex.multiline);
console.log(regex.lastIndex);
console.log(regex.source);//log
true
true
true
0
(^|\s)high(\s|$)

9. API的区别

API 的区别
String#searchString#splitString#matchString#replaceRegExp#testRegExp#exec
g是否有影响
lastIndex是否变化是(带g)
否(不带g)
是(带g)
否(不带g)
字符串自动转正则
(例如 . 变成了通配符)
\\


参考书籍:
《JavaScript正则表达式迷你书》 —— 老姚

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

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

相关文章

react根据后端返回数据动态添加路由

以下代码都为部分核心代码 一.根据不同的登录用户,返回不同的权限列表 ,以下是三种不同用户限权列表 const pression { //超级管理员BigAdmin: [{key: "screen",icon: "FileOutlined",label: "数据图表",},{key: "…

谷粒商城学习笔记-使用renren-fast-vue框架时安装依赖包遇到的问题及解决策略

文章目录 1,npm error Class extends value undefined is not a constuctor or null2,npm warn cli npm v10.8.1 does not support Node.js v16.20.2.3,npm error code CERT_HAS_EXPIRED学习心得 这篇文章记录下使用renren-fast-vue&#xff…

QT学习(6)——QT中的定时器事件,两种实现方式;事件的分发event,事件过滤器

目录 引出定时器事件QTimerEventQTimer 事件的分发事件过滤器 总结QT中的鼠标事件定义QLable的鼠标进入离开事件提升为myLabel重写QLabel的函数鼠标的事件鼠标的左中右键枚举鼠标多事件获取和鼠标移动鼠标追踪 QT中的信号和槽自定义信号和槽1.自定义信号2.自定义槽3.建立连接4.…

C++ 类和对象 拷贝构造函数

一 拷贝构造函数的概念: 拷贝构造函数是一种特殊的构造函数,用于创建一个对象是另一个对象的副本。当需要用一个已存在的对象来初始化一个新对象时,或者将对象传递给函数或从函数返回对象时,会调用拷贝构造函数。 二 拷贝构造函…

打卡第6天----哈希表

每天进步一点点,滴水石穿,日积月累,不断提升。 数组和链表章节告一段落。开启哈希表相关的。 哈希表能解决什么问题呢,一般哈希表都是用来快速判断一个元素是否出现集合里 一、有效的字母异位词 leetcode题目编号:242 题目描述: 给定两个字符串 s 和 t ,编写一个函数…

安装和配置 MSYS2

MSYS2(Minimal SYStem 2)是一个为Windows平台提供的轻量级Linux类系统,它集成了大量的GNU工具链、工具和库,为开发者提供了一个类似于Linux的shell环境和完整的开发环境。以下是关于MSYS2的详细介绍: 一、定义与特点 …

深入理解Java中的泛型编程

深入理解Java中的泛型编程 大家好,我是微赚淘客系统3.0的小编,也是冬天不穿秋裤,天冷也要风度的程序猿! 1. 泛型的基础概念 在Java中,泛型编程是一种强大的编程范式,它允许我们编写可以操作各种类型的代…

vagrant远程连接不上问题

如果使用的是vbox虚拟机的host_only的默认ip为56.1开头如果使用这个1作为地址,只能使用转发的形式连接,宿主机使用ssh -p 22222 name127.0.0.1 连接,如果配置的主机位大于1则可以使用虚拟机的ip地址连接。 1使用网络地址转换(ant…

Linux忘记密码重置root密码、重置普通用户密码

重启看到选项按e reboot 或 init 62、移动到Linux开头的行在末尾添加 rw init/bin/bash3、按下Ctrlx引导启动 mount -o remount,rw /输入命令回车更改密码,输入新密码,别用小键盘,容易出错 passwd输入两次校验,出现updated successfully就…

OceanBase 配置项系统变量实现及应用详解(1):配置项的定义及使用方法

《OceanBase 配置项&系统变量实现及应用详解》专题导读 在使用OceanBase的过程中,看到大家经常会遇到“参数”、“配置项”、“系统变量”等概念,却不太清楚它们是不是同一个东西,以及应该如何使用。一些对数据库开发感兴趣的朋友&#…

开源大模型对比

随着chatgpt诞生,开源大模型的也获得了突飞猛进的进展,值得关注的是国内本地私有大模型已经在很多真实的场景中落地,比如智能客服。美国的技术研发能力遥遥领先,但是不得不说落地应用这块是我们的强项。企业使用大模型一般需要考虑…

【面向就业的Linux基础】从入门到熟练,探索Linux的秘密(九)-git(1)

Git是一个版本管理控制系统(缩写VCS),它可以在任何时间点,将文档的状态作为更新记录保存起来,也可以在任何时间点,将更新记录恢复回来。 文章目录 前言 一、git是什么 二、git基本概念 三、git基本命令 总结…

电商项目中分与元金额单位互转实战

在Java开发中,可能遇到金额单位的转换,比如本系统用分作为金额的基本单位,对方系统用元作为金额的基本单位,这就需要进行单位转换,记录下来,方便备查。 一、分转元 分转元,分到元相差两位&…

PHP源码:新闻门户系统(附管理后台+前台)

一. 前言 今天小编给大家带来了一款可学习,可商用的,新闻门户系统 源码,支持二开,无加密。项目可以扩展为个人博客,和一些社交论坛网址。主要功能:支持文章管理,评论管理,分类管理等…

Kotlin linkedMapOf filterKeys

Kotlin linkedMapOf filterKeys fun main(args: Array<String>) {val lhm linkedMapOf<String, Any>(Pair("name", "phil"), //因为key相同都为 name&#xff0c;被后面的覆盖。Pair("year", 2024),Pair("name", "f…

大语言模型的应用探索AI Agent初探!

前言 大语言模型的应用之一是与大语言模型进行聊天也就是一个ChatBot&#xff0c;这个应用已经很广泛了。 接下来的一个应用就是AI Agent。 AI Agent是人工智能代理&#xff08;Artificial Intelligence Agent&#xff09;的概念&#xff0c;它是一种能够感知环境、进行决策…

消防认证-防火窗

一、消防认证 消防认证是指消防产品符合国家相关技术要求和标准&#xff0c;且通过了国家认证认可监督管理委员会审批&#xff0c;获得消防认证资质的认证机构颁发的证书&#xff0c;消防产品具有完好的防火功能&#xff0c;是住房和城乡建设领域验收的重要指标。 二、认证依据…

GEE代码实例教程详解:NDVI时间序列趋势分析

简介 在本篇博客中&#xff0c;我们将使用Google Earth Engine (GEE) 对MODIS NDVI数据进行时间序列趋势分析。通过分析2001年至2021年的NDVI数据&#xff0c;我们可以了解植被覆盖度随时间的变化趋势。 背景知识 MODIS数据集 MODIS&#xff08;Moderate Resolution Imagin…

Websocket在Java中的实践——整合Rabbitmq和STOMP

大纲 Rabbitmq开启STOMP支持 服务端依赖参数参数映射类配置类逻辑处理类 测试测试页面Controller测试案例 在《Websocket在Java中的实践——STOMP通信的最小Demo》一文中&#xff0c;我们使用enableSimpleBroker启用一个内置的内存级消息代理。本文我们将使用Rabbitmq作为消息代…