JS中正则表达式要注意lastIndex属性


Posted in Javascript onAugust 08, 2017

 说明

这篇文章,主要和大家聊聊JavaScript中RegExp对象的属性。

解释

每个RegExp对象都包含5个属性,source、global、ignoreCase、multiline、lastIndex。

source:是一个只读的字符串,包含正则表达式的文本。

var reg = /JavaScript/;
reg.source; //返回 JavaScript

global:是一个只读的布尔值,看这个正则表达式是否带有修饰符g。

修饰符g,是全局匹配的意思,检索字符串中所有的匹配。

var str = "JavaScript";
str.match(/JavaScript/); //只能匹配一个JavaScript 
var str = "JavaScript JavaScript";
str.match(/JavaScript/g); //能匹配两个JavaScript 
var reg = /JavaScript/;
reg.global; //返回 false
var reg = /JavaScript/g;
reg.global; //返回 true

ignoreCase:是一个只读的布尔值,看这个正则表达式是否带有修饰符i。

修饰符i,说明模式匹配是不区分大小写的。

var reg = /JavaScript/;
reg.ignoreCase; //返回 false
var reg = /JavaScript/i;
reg.ignoreCase; //返回 true
var reg = /JavaScript/;
reg.test("javascript"); //返回 false
var reg = /JavaScript/i;
reg.test("javascript"); //返回 true

multiline:是一个只读的布尔值,看这个正则表达式是否带有修饰符m。

修饰符m,用以在多行模式中执行匹配,需要配合^ 和 $</code> 使用,使用<code>^</code> 和 <code>$ 除了匹配整个字符串的开始和结尾之外,还能匹配每行的开始和结尾。

var str="java\nJavaScript";
str.match(/^JavaScript/); //返回null
var str="java\nJavaScript";
str.match(/^JavaScript/m); //匹配到一个JavaScript
var reg=/JavaScript/;
reg.multiline; //返回false
var reg=/JavaScript/m;
reg.multiline; //返回true

lastIndex:是一个可读/写的整数,如果匹配模式中带有g修饰符,这个属性存储在整个字符串中下一次检索的开始位置,这个属性会被exec( ) 和 test( ) 方法用到。

exec( )方法是在一个字符串中执行匹配检索,如果它没有找到任何匹配,它就返回null,但如果它找到了一个匹配,它就返回一个数组。

当调用exec( )的正则表达式对象具有修饰符g时,它将把当前正则表达式对象的lastIndex属性设置为紧挨着匹配子串的字符位置,当同一个正则表达式第二次调用exec( ),它会将从lastIndex属性所指示的字符串处开始检索,如果exec( )没有发现任何匹配结果,它会将lastIndex重置为0。

JS中正则表达式要注意lastIndex属性

test( )方法,它的参数是一个字符串,用test( )对某个字符串进行检测,如果包含正则表达式的一个匹配结果,则返回true,否则返回false。

var str="java";
var reg=/JavaScript/;
reg.test(str); //返回false
var str="JavaScript";
var reg=/JavaScript/;
reg.test(str); //返回true

当调用test( )的正则表达式对象具有修饰符g时,它的行为和exec( )相同,因为它从lastIndex指定的位置处开始检索某个字符串,如果它找到了一个匹配结果,那么它就立即设置lastIndex为紧挨着匹配子串的字符位置

看看下面这段有趣的代码

var str="JavaScript";
var reg=/JavaScript/g;
console.log(reg.test(str)); //打印 true
console.log(reg.test(str)); //打印 false

为什么同样的字符串,同样的正则表达式,却打印的不一样,如果你已经理解了 lastIndex属性,那你一定明白为什么。

我们来看看到底发什么了什么

var str="JavaScript";
var reg=/JavaScript/g;
console.log(reg.test(str)); //打印 true
console.log(reg.lastIndex);
//打印10,因为匹配到了JavaScript,所以设置lastIndex为匹配结果紧挨着的字符位置
console.log(reg.test(str));
//打印 false,因为从lastIndex位置检索字符串,已经没有匹配结果了
console.log(reg.lastIndex);
//打印0,因为没有匹配到结果,所以将lastIndex重置为0

这里注意一点,如果第一次调用test( )匹配结束后,我们手动将lastIndex重置为0,那么第二次调用test( ),同样可以打印true

var str="java JavaScript java";
var reg=/JavaScript/g;
console.log(reg.test(str)); //打印 true
reg.lastIndex=0;
console.log(reg.test(str)); //打印 true

在强调一次,上面说的关于lastIndex的问题,都是因为正则表达式对象中带有修饰符g,如果不带有修饰符g,就不用担心这些问题了。

总结

这次主要是说说,JavaScript中正则表达式对象的5个属性,而最需要注意的就是lastIndex属性了。

Javascript 相关文章推荐
jQuery)扩展jQuery系列之一 模拟alert,confirm(一)
Dec 04 Javascript
告诉你什么是javascript的回调函数
Sep 04 Javascript
js实现网页标题栏闪烁提示效果实例分析
Nov 20 Javascript
深入理解JavaScript系列(35):设计模式之迭代器模式详解
Mar 03 Javascript
javascript实现完美拖拽效果
May 06 Javascript
深入理解JavaScript中的对象
Jun 04 Javascript
直接拿来用的页面跳转进度条JS实现
Jan 06 Javascript
JavaScript绑定事件监听函数的通用方法
May 14 Javascript
Angular 路由route实例代码
Jul 12 Javascript
详解Javascript数据类型的转换规则
Dec 12 Javascript
JS如何实现网站中PC端和手机端自动识别并跳转对应的代码
Jan 08 Javascript
Vue表单控件数据绑定方法详解
Feb 05 Javascript
vue+mockjs模拟数据实现前后端分离开发的实例代码
Aug 08 #Javascript
React Native如何消除启动时白屏的方法
Aug 08 #Javascript
react native带索引的城市列表组件的实例代码
Aug 08 #Javascript
React Native仿美团下拉菜单的实例代码
Aug 08 #Javascript
React-Native 组件之 Modal的使用详解
Aug 08 #Javascript
基于jQuery对象和DOM对象和字符串之间的转化实例
Aug 08 #jQuery
超级简易的JS计算器实例讲解(实现加减乘除)
Aug 08 #Javascript
You might like
php 阴历-农历-转换类代码
2012/01/16 PHP
分享一个php 的异常处理程序
2014/06/22 PHP
php实现源代码加密的方法
2015/07/11 PHP
thinkphp整合微信支付代码分享
2016/11/24 PHP
一个非常实用的php文件上传类
2017/07/04 PHP
thinkPHP框架实现类似java过滤器的简单方法示例
2018/09/05 PHP
PHP高并发和大流量解决方案整理
2021/03/09 PHP
poshytip 基于jquery的 插件 主要用于显示微博人的图像和鼠标提示等
2012/10/12 Javascript
浅析JavaScript动画
2015/06/10 Javascript
jQuery实现鼠标经过购物车出现下拉框代码(推荐)
2016/07/21 Javascript
jQuery使用serialize()表单序列化时出现中文乱码问题的解决办法
2016/07/27 Javascript
浅谈JavaScript的自动垃圾收集机制
2016/12/15 Javascript
React Router基础使用
2017/01/17 Javascript
详解AngularJs HTTP响应拦截器实现登陆、权限校验
2017/04/11 Javascript
node.js中fs.stat与fs.fstat的区别详解
2017/06/01 Javascript
微信二次分享报错invalid signature问题及解决方法
2019/04/01 Javascript
解决微信浏览器缓存站点入口文件(IIS部署Vue项目)
2019/06/17 Javascript
在vue中使用echars实现上浮与下钻效果
2019/11/08 Javascript
python创建列表和向列表添加元素的实现方法
2017/12/25 Python
通过python顺序修改文件名字的方法
2018/07/11 Python
NumPy 基本切片和索引的具体使用方法
2019/04/24 Python
Python3基础教程之递归函数简单示例
2019/06/07 Python
基于Python的图像数据增强Data Augmentation解析
2019/08/13 Python
Python大数据之从网页上爬取数据的方法详解
2019/11/16 Python
python如何删除列为空的行
2020/07/17 Python
什么是反射
2012/03/17 面试题
高中毕业自我鉴定
2013/12/16 职场文书
《赵州桥》教学反思
2014/02/17 职场文书
多媒体教室标语
2014/06/26 职场文书
小学综治宣传月活动总结
2014/07/02 职场文书
“四风”问题自我剖析材料思想汇报
2014/09/23 职场文书
党的群众路线教育实践活动对照检查材料(四风)
2014/09/27 职场文书
2014年幼儿园教师工作总结
2014/11/08 职场文书
2015年绩效考核工作总结
2015/05/23 职场文书
《走遍天下书为侣》教学反思
2016/02/22 职场文书
MySQL 主从复制数据不一致的解决方法
2022/03/18 MySQL