详解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 相关文章推荐
Stop SQL Server
Jun 21 Javascript
js解决弹窗问题实现班级跳转DIV示例
Jan 06 Javascript
Javascript保存网页为图片借助于html2canvas库实现
Sep 05 Javascript
javascript 操作符(~、&amp;、|、^、)使用案例
Dec 31 Javascript
jQuery实现切换字体大小的方法
Mar 10 Javascript
理解JS事件循环
Jan 07 Javascript
JavaScript驾驭网页-CSS与DOM
Mar 24 Javascript
JavaScript基于自定义函数判断变量类型的实现方法
Nov 23 Javascript
基于JavaScript实现表格滚动分页
Nov 22 Javascript
JS数组方法concat()用法实例分析
Jan 18 Javascript
在vue中使用Echarts画曲线图的示例
Oct 03 Javascript
vue+element ui实现锚点定位
Jun 29 Vue.js
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读取zip文件的方法示例
2016/11/17 PHP
thinkPHP5.0框架URL访问方法详解
2017/03/18 PHP
php 根据自增id创建唯一编号类
2017/04/06 PHP
jQuery技巧大放送 学习jquery的朋友可以看下
2009/10/14 Javascript
使用jQuery validate 验证注册表单实例演示
2013/03/25 Javascript
jQuery定义背景动态切换效果的方法
2015/03/23 Javascript
jquery mobile开发常见问题分析
2016/01/21 Javascript
js控制li的隐藏和显示实例代码
2016/10/15 Javascript
使用jsonp实现跨域获取数据实例讲解
2016/12/25 Javascript
使用JavaScriptCore实现OC和JS交互详解
2017/03/28 Javascript
JS鼠标滚动分页效果示例
2017/07/05 Javascript
input type=file 选择图片并且实现预览效果的实例
2017/10/26 Javascript
微信小程序promsie.all和promise顺序执行
2017/10/27 Javascript
web前端页面生成exe可执行文件的方法
2018/02/08 Javascript
React中阻止事件冒泡的问题详析
2019/04/12 Javascript
javascript实现评分功能
2020/06/24 Javascript
JavaScript实现轮播图效果
2020/10/30 Javascript
[01:08:57]2014 DOTA2国际邀请赛中国区预选赛 5 23 CIS VS LGD第二场
2014/05/24 DOTA
十个Python程序员易犯的错误
2015/12/15 Python
Python中分支语句与循环语句实例详解
2018/09/13 Python
np.dot()函数的用法详解
2020/01/17 Python
Python制作数据预测集成工具(值得收藏)
2020/08/21 Python
Css3圆角边框制作代码
2015/11/18 HTML / CSS
DERMAdoctor官网:美国著名皮肤护理品牌
2019/07/06 全球购物
科颜氏英国官网:Kiehl’s英国
2019/11/20 全球购物
办公室文秘自我鉴定
2013/09/21 职场文书
工商企业管理实习自我鉴定
2013/12/04 职场文书
国培远程培训感言
2014/03/08 职场文书
标准的毕业生自荐信
2014/04/20 职场文书
政府采购方案
2014/06/12 职场文书
2014超市收银员工作总结
2014/11/13 职场文书
学校团代会开幕词
2016/03/04 职场文书
分享:关于学习的励志名言赏析
2019/08/16 职场文书
JDBC连接的六步实例代码(与mysql连接)
2021/05/12 MySQL
ajax请求前端跨域问题原因及解决方案
2021/10/16 Javascript
Nginx性能优化之Gzip压缩设置详解(最大程度提高页面打开速度)
2022/02/12 Servers