js 踩了正则表达式的大坑!lastIndex属性

news2024/11/17 1:46:57

参考文章

踩坑情景

今天一来,被测试测出了一个问题,在使用vantUI的移动端项目中,我虽然对用户输入的值做了去除首尾空格的操作,但却忘记对用户输入的空值进行错误提示,fine,我选择给表单添加rules规则,想进行正则匹配判断优化,如下

rules: [{ required: true, message: "请填写地址" }, // 必填
        { pattern: /(^\s*)\S+(\s*$)/g, message:"请填写正确的地址" }// 空值提示]

结果却发现
在这里插入图片描述
左思右想,觉得自己的正则写的没问题吧,就去控制台试了一试
在这里插入图片描述
这就很离谱,百思不得其解,在反复的试错中,发现了规律

交换字符串的顺序后
在这里插入图片描述
同一个字符串匹配两次
在这里插入图片描述

突然反应过来,不是 123123 能匹配上,而 123123不能匹配上,而是同一个正则它只能匹配一次

问题原因

知道具体问题就好找答案了,网上一搜还有不少踩同一个坑的

先看看js中正则表达式的使用方法,有两种:

第一种是正则表达式对象的方法,常用的有两种:
1.exec(str)检索字符串中指定的值,返回找到的值,并确定其位置
2.test(str)检索字符串中指定的值,返回true或false

第二种是字符串对象的方法,常用的有四种:
1.match(regexp)找到一个或多个正则表达式的匹配,返回一个配对的数组(该数组的内容依赖于regexp是否具有全局标志g)
2.replace(regexp/substr,replacement)替换与正则表达式匹配的子串,返回一个新的字符串(replacement可以是字符串或函数、lambda表达式)
3.search(regexp)检索与正则表达式相匹配的值,返回相匹配的子串的起始位置,否则返回 -1。(它将忽略标志g和 lastIndex属性,且总是从字符串的开始处进行检索)
4.split(search)把字符串根据正则匹配的字符,分割为字符串数组,返回数组

那为什么使用正则RegExp.test( )方法时第一次是 true,第二次是false?这个正则对象的lastIndex属性有关

lastIndex属性用于规定下次匹配的起始位置,RegExp.exec( ) RegExp.test( )的每次调用都会影响到正则对象的lastIndex属性,上一次查询结束的位置会作为下一次查询的开始位置,这样,就可以通过反复调用这两个方法来遍历一个字符串中的所有匹配文本

注意:该属性只有设置标志g才能使用

解决方法

方法一:知道lastIndex属性必须要设置标志g才能使用,所以我们在匹配时,可以根据情况,直接去掉标志g即可
在这里插入图片描述

方法二:在不能去掉标志g的情况下,我们可以重写lastIndex属性,lastIndex属性是可读可写的,每次查询结束后,就把lastIndex的值重置为0,这样再执行全局匹配时,就不会出现false的情况
在这里插入图片描述

方法三:使用str.match()方法,判断返回值是否是Null对象
在这里插入图片描述

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

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

相关文章

[附源码]JAVA毕业设计远程教学系统录屏(系统+LW)

[附源码]JAVA毕业设计远程教学系统录屏(系统LW) 项目运行 环境项配置: Jdk1.8 Tomcat8.5 Mysql HBuilderX(Webstorm也行) Eclispe(IntelliJ IDEA,Eclispe,MyEclispe,Sts都支持)。 项目技术…

40个高质量SSM毕设项目分享【源码+论文】

文章目录前言 题目1 : 基于SSM的房屋出租出售系统 <br /> 题目2 : 基于SSM的房屋租赁系统 <br /> 题目3 : 基于SSM的个人健康信息管理系统 <br /> 题目4 : 基于SSM的共享充电宝管理系统 <br /> 题目5 : 基于SSM的即动运动网站 <br />前言 &…

【C语言数据结构(基础篇)】第二站:顺序表

目录 一、线性表 二、顺序表的实现&#xff08;概念以及静态顺序表&#xff09; 1.创建三个工程文件 2.顺序表的概念 3.顺序表的定义 4.初始化顺序表 5.静态顺序表的尾插 三、顺序表的实现&#xff08;升级为动态顺序表&#xff09; 1.动态顺序表的定义 2.动态顺序表的…

艾美捷NCTC-135培养基化学性质和基本配方

艾美捷NCTC-135培养基背景&#xff1a; NCTC培养基&#xff0c;由马里兰州贝塞斯达国家癌症研究所&#xff08;NCI&#xff09;生物实验室组织培养科开发&#xff0c;用于建立和维持L929小鼠细胞株。 艾美捷NCTC-135培养基化学性质&#xff1a; 外观&#xff1a;白色至浅粉色…

[附源码]Python计算机毕业设计Django超市商品管理

项目运行 环境配置&#xff1a; Pychram社区版 python3.7.7 Mysql5.7 HBuilderXlist pipNavicat11Djangonodejs。 项目技术&#xff1a; django python Vue 等等组成&#xff0c;B/S模式 pychram管理等等。 环境需要 1.运行环境&#xff1a;最好是python3.7.7&#xff0c;…

Android -- 每日一问:谈谈MVC、MVP和MVVM模式,你有在自己的项目中使用过吗?

经典回答 MVC 模式 全名是Model–View–Controller&#xff0c;是模型(model)&#xff0d;视图(view)&#xff0d;控制器(controller)的缩写&#xff0c;一种软件设计典范&#xff0c;用一种业务逻辑、数据、界面显示分离的方法组织代码&#xff0c;在改进和个性化定制界面及用…

[附源码]Python计算机毕业设计SSM基于的高速收费系统(程序+LW)

项目运行 环境配置&#xff1a; Jdk1.8 Tomcat7.0 Mysql HBuilderX&#xff08;Webstorm也行&#xff09; Eclispe&#xff08;IntelliJ IDEA,Eclispe,MyEclispe,Sts都支持&#xff09;。 项目技术&#xff1a; SSM mybatis Maven Vue 等等组成&#xff0c;B/S模式 M…

防火墙双机热备配置实验

目录 一、实验拓扑 二、配置云 三、配置防火墙 四、分配FW的接口地址与安全区域 五、按图示进行配置 六、双机热备的配置 七、配置NAT 八、模拟双机热备的切换 一、实验拓扑 看上去挺复杂的其实这个实验还是比较简单的&#xff0c;Client1配置为IP 10.3.0.10 网关10.3.…

python教程十二 字典

字典 字典是另一种可变容器模型&#xff0c;且可存储任意类型对象。 字典的每个键值 key>value 对用冒号 : 分割&#xff0c;每个对之间用逗号(,)分割&#xff0c;整个字典包括在花括号 {} 中 ,格式如下所示&#xff1a; d {key1 : value1, key2 : value2, key3 : value3…

学会模态计算,你就掌握了结构振动冲击计算的核心

模态计算对于认识结构振动特性至关重要&#xff0c;通过模态计算可以得到模态的固有频率&#xff0c;振型&#xff0c;参与系数和有效质量等参数&#xff0c;模态计算的这些参数我们应该很熟悉&#xff0c;但是如果正确合理的使用这些结果指导工程计算&#xff0c;是我们今天讨…

[附源码]Python计算机毕业设计滁州市围棋协会Django(程序+LW)

该项目含有源码、文档、程序、数据库、配套开发软件、软件安装教程 项目运行 环境配置&#xff1a; Pychram社区版 python3.7.7 Mysql5.7 HBuilderXlist pipNavicat11Djangonodejs。 项目技术&#xff1a; django python Vue 等等组成&#xff0c;B/S模式 pychram管理等…

12月12日: 学习跟着猫叔写代码

视频地址&#xff1a;fastadmin系列教程:小白学习之路 学前准备 安装过程 数据库分析 关联查询搜索 数据校验 视图渲染 api登录注册 token验证 table表格_哔哩哔哩_bilibili 前两节是安装fastadmin操作&#xff08;可参考我自己的文章&#xff09; 11月30日&#xff1a;linux服…

当要测试的对象依赖另一个无法控制的对象(系统相关、第三方服务等),这个时候我们应该如何测试?

一.问题描述 判断文件是否有效的需求变更了&#xff1a;有效的文件扩展名存储在文件系统中&#xff0c;要测试的FileVerify类就依赖FileExtensionManager类&#xff0c;在这种场景下如何测试FileVerify类的逻辑呢? 1 public class FileVerify2 { 3 …

精品基于SSM的社区疫情防控平台

《基于SSM的社区疫情防控平台》该项目含有源码、论文等资料、配套开发软件、软件安装教程、项目发布教程等 使用技术&#xff1a; 开发语言&#xff1a;Java 框架&#xff1a;ssm 技术&#xff1a;JSP JDK版本&#xff1a;JDK1.8 服务器&#xff1a;tomcat7 数据库&…

(附源码)springboot螺丝加工厂订单管理 毕业设计 010346

题 目 springboot螺丝加工厂订单管理 目 录 摘要 1 1 绪论 1 1.1项目开发的背景 1 1.2项目开发的意义 1 1.3系统开发技术的特色 1 1.4论文结构与章节安排 1 2 螺丝加工厂订单管理 系统分析 3 2.1 可行性分析 3 2.2 系统流程分析 3 2.2.1数据流程 3 2.3.2业务流程 4 2.3 系统…

C++11标准模板(STL)- 算法(std::sort_heap)

定义于头文件 <algorithm> 算法库提供大量用途的函数&#xff08;例如查找、排序、计数、操作&#xff09;&#xff0c;它们在元素范围上操作。注意范围定义为 [first, last) &#xff0c;其中 last 指代要查询或修改的最后元素的后一个元素。 数据结构的堆物理结构是数…

百度地图(HTML5新特性)-全面详解(学习总结---从入门到深化)

目录 百度地图_账号和获取密钥 百度地图_初始化 百度地图_变更地图类型 百度地图_添加控件 百度地图_改变控件位置 百度地图_添加覆盖物 百度地图_自定义标注图标 百度地图_添加文本标注 百度地图_正/逆地址解析 百度地图_信息窗口 百度地图_规划驾车路线 百度地图_…

亚马逊、速卖通、阿里国际自动和手动广告的核心是什么?自己养买家号测评的好处

亚马逊等跨境电商平台在打造的新品期&#xff0c;因为选择的细分类目是非常精准刚需的&#xff0c;词少&#xff0c;所以一开始只开启了自动广告&#xff0c;自动广告跑起来&#xff0c;转化很好。 自动广告跑了一段时间之后&#xff0c;把自动广告里表现比较好的出单词都挑出…

冰雪旅游热开启!IU酒店与您畅游山水之间

连日来&#xff0c;全国多地不断调整疫情防控措施&#xff0c;提高科学精准防控能力。国家防疫“新十条”出台后&#xff0c;大众旅游热情明显增高。 据穷游网站内数据显示&#xff0c;去海南、云南等地避寒&#xff0c;或前往东北、新疆等地滑雪备受用户推崇。三亚、上海、成…

spark上传文件和追加文件到hdfs

val status uploadFile(“C:\Users\com\Desktop\测试数据\”,“/test/file/”,“报销单.docx”) if(status) println(“上传成功&#xff01;”) else println(“上传失败”) } /** 本地文件上传到 hdfs param localDirectory 本地目录 param hdfsDirectory hdfs目录 pa…