详解JavaScript RegExp对象


Posted in Javascript onFebruary 04, 2017

什么是 RegExp?

正则表达式描述了字符的模式对象。

当您检索某个文本时,可以使用一种模式来描述要检索的内容。RegExp 就是这种模式。

简单的模式可以是一个单独的字符。

更复杂的模式包括了更多的字符,并可用于解析、格式检查、替换等等。

您可以规定字符串中的检索位置,以及要检索的字符类型,等等。

RegExp对象是原生JavaScript中表示正则表达式的对象。

创建对象的方法为:var RegExp = new RegExp(pattern, attributes);

参数pattern指定正则表达式的规则或者表示正则表达式模式的字符串;

参数attributes为可选参数,表示匹配模式的修饰符。包含3个参数:

1.  i:执行对大小写不敏感匹配;

<script text="text/javascript">
var txt = 'Hello World!'

var reg = new RegExp('hello', 'i');

if(reg.test(txt)) {


console.log(txt.match(reg));

}
</script>

2.  g:执行全局匹配(查找所有匹配项而非找到第一个匹配项后停止);

<script text="text/javascript">
  var txt = 'This is just a test.'
  var reg = new RegExp('is', 'g');//区分大小写
  var reg01 = new RegExp('is', 'gi');//不区分大小写
  if(reg.test(txt)) {
    console.log(txt.match(reg));//["is", "is"]
    console.log(txt.match(reg).length);//2
  }
</script>

3.  m:执行多行匹配(若不设置该属性,^($)只与整个被搜索字符串的开始(结尾)位置开始匹配;若设置该属性,^($)还可以与被搜索字符串的“\r”或“\n”之后位置开始匹配)。

<script type="text/javascript">
  //以下代码不能够匹配字符串"an",尽管"an"后面已经换行了,但"an"并不是字符串行的结尾。
  var txt1 = 'This is an\n apple'; 
  var reg1 = /an$/;
  console.log(txt1.match(reg1));//null
  //以下代码能够匹配到字符串"an"
  var txt2 = 'This is an\n apple';
  var reg2 = /an$/m;
  console.log(txt2.match(reg2));//["an", index: 8, input: "This is an↵ apple"]  
  //以下是多行匹配开头示例
  var txt3 = 'This is an\n apple';
  var reg3 = /^\sapp/;
  console.log(txt3.match(reg3));//null
  
  var txt4 = 'This is an\n apple';
  var reg4 = /^\sapp/m;// /^ app/m
  console.log(txt4.match(reg4));//[" app", index: 11, input: "This is an↵ apple"]
</script>

i,g,m三个修饰符可以相互组合同时使用。

以上m修饰符中的示例中var reg4 = /^\sapp/的"\"是一个转义字符,如果使用构造函数创建RegExp对象时,应将正则表达式中的"\"用"\\"进行代替:

<script type="text/javascript">
  var txt4 = 'This is an\n apple';
  var reg4 = new RegExp('^\\sapp', 'm');
  console.log(txt4.match(reg4));//[" app", index: 11, input: "This is an↵ apple"]
</script>

RegExp对象属性

1.global

返回正则表达式是否具有"g"修饰符;

<script type="text/javascript">
  var txt = 'This is just a test';
  var reg = new RegExp('st', 'g');
  if(reg.global) {
    console.log(txt.match(reg));//["st", "st"]
  }
</script>

2.ignoreCase

返回正则表达式是否具有"i"修饰符;

3.multiline

返回正则表达式是否具有"m"修饰符;

4.lastIndex

标记下一次匹配开始时所在字符串的位置;

<script type="text/javascript">
  var txt = 'If you love code, you should code everyday.';
  var reg = new RegExp('ou', 'g');
  var length = txt.match(reg).length;
  for(var i = 0; i < length; i++) {
    reg.test(txt);
    console.log(reg.lastIndex);
  }
</script>

5.source

返回正则表达式进行模式匹配的文本或表达式,返回的文本中不包括修饰符"i","g","m",也不包括正则表达式直接量使用的定界符

<script>
  var reg1 = new RegExp('yoho', 'm');
  var reg2 = new RegExp('\\w');
  var reg3 = /\w/m;
  console.log(reg1.source);//yoho
  console.log(reg2.source);//\w
  console.log(reg3.source);//\w
</script>

RegExp对象方法

1.compile

改变或重新编译正则表达式(Opera浏览器不支持该方法)

对于正则表达式的重新定义,以下方法就可以实现,所以对于此方法的应用场景,我也不是很清楚

<script>
  var reg = new RegExp('ou', 'g');
  reg = /\w/;
</script>

2.exec

检索字符串中正则表达式的匹配结果

<script>
  var txt = 'If you love code, you should code everyday.';
  var reg = new RegExp('ou', 'g');
  var length = txt.match(reg).length;
  for(var i = 0; i < length; i++) {
    console.log(reg.exec(txt));
  }
</script>

3.test

检测字符串是否与匹配正则表达式匹配

<script>
  var txt = 'I code everyday.';
  var reg = new RegExp('code');
  console.log(reg.test(txt));//true
</script>

以上所述是小编给大家介绍的JavaScript RegExp对象,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
jquery last-child 列表最后一项的样式
Jan 22 Javascript
IE8下关于querySelectorAll()的问题
May 13 Javascript
js控制table合并具体实现
Feb 20 Javascript
js 采用delete实现继承示例代码
May 20 Javascript
浅谈jQuery页面的滚动位置scrollTop、scrollLeft
May 19 Javascript
详谈javascript中的cookie
Jun 03 Javascript
JS动态的把左边列表添加到右边的实现代码(可上下移动)
Nov 17 Javascript
AngularJS实现根据不同条件显示不同控件
Apr 20 Javascript
jQuery事件对象的属性和方法详解
Sep 09 jQuery
详解react关于事件绑定this的四种方式
Mar 09 Javascript
react实现换肤功能的示例代码
Aug 14 Javascript
vue 左滑删除功能的示例代码
Jan 28 Javascript
JS查找字符串中出现最多的字符及个数统计
Feb 04 #Javascript
JavaScript获取中英文混合字符串长度的方法示例
Feb 04 #Javascript
纯js模仿windows系统日历
Feb 04 #Javascript
canvas的神奇用法
Feb 03 #Javascript
Jquery实现跨域异步上传文件总结
Feb 03 #Javascript
js 递归和定时器的实例解析
Feb 03 #Javascript
js实现文本上下来回滚动
Feb 03 #Javascript
You might like
PHP获取数组最后一个值的2种方法
2015/01/21 PHP
PHP explode()函数的几个应用和implode()函数有什么区别
2015/11/05 PHP
laravel学习教程之存取器
2016/07/30 PHP
仅IE6/7/8中innerHTML返回值忽略英文空格的问题
2011/04/07 Javascript
javascript常见操作汇总
2014/09/03 Javascript
Linux下编译安装php libevent扩展实例
2015/02/14 Javascript
JavaScript实现级联菜单的方法
2015/06/29 Javascript
jQuery自动完成插件completer附源码下载
2016/01/04 Javascript
jquery拖拽排序简单实现方法(效果增强版)
2016/02/16 Javascript
使用Bootstrap Tabs选项卡Ajax加载数据实现
2016/12/23 Javascript
javascript帧动画(实例讲解)
2017/09/02 Javascript
Node.js学习之地址解析模块URL的使用详解
2017/09/28 Javascript
vue中使用echarts制作圆环图的实例代码
2018/07/27 Javascript
vue+Element-ui实现分页效果实例代码详解
2018/12/10 Javascript
vue鼠标悬停事件实例详解
2019/04/01 Javascript
JS实现提示框跟随鼠标移动
2019/08/27 Javascript
关于vue2强制刷新,解决页面不会重新渲染的问题
2019/10/29 Javascript
webpack的 rquire.context用法实现工程自动化的方法
2020/02/07 Javascript
[04:42]2015国际邀请赛CDEC战队晋级之路
2015/08/13 DOTA
详解python并发获取snmp信息及性能测试
2017/03/27 Python
使用Scrapy爬取动态数据
2018/10/21 Python
BP神经网络原理及Python实现代码
2018/12/18 Python
一篇文章了解Python中常见的序列化操作
2019/06/20 Python
python tkinter图形界面代码统计工具(更新)
2019/09/18 Python
css3动画效果小结(推荐)
2016/07/25 HTML / CSS
全球速卖通俄罗斯站:AliExpress俄罗斯
2019/06/17 全球购物
新加坡一家在线男士皮具品牌:Faire Leather Co.
2019/12/01 全球购物
英国最大的天然和有机产品在线零售商之一:Big Green Smile
2020/05/06 全球购物
钳工实习自我鉴定
2013/09/19 职场文书
酒店总经理欢迎词
2014/01/15 职场文书
欢迎家长标语
2014/10/08 职场文书
2014年办公室工作总结范文
2014/11/12 职场文书
2015年工程师工作总结
2015/04/30 职场文书
2019 入党申请书范文
2019/07/10 职场文书
MySQL 角色(role)功能介绍
2021/04/24 MySQL
python中的被动信息搜集
2021/04/29 Python