详解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 相关文章推荐
ExtJS 2.0实用简明教程 之ExtJS版的Hello
Apr 29 Javascript
IE6不能修改NAME问题的解决方法
Sep 03 Javascript
jquery mobile动态添加元素之后不能正确渲染解决方法说明
Mar 05 Javascript
一个简单的jQuery计算器实现了连续计算功能
Jul 21 Javascript
js实现简易的单数字随机抽奖(0-9)
Mar 19 Javascript
js获取时间函数及扩展函数的方法
Oct 30 Javascript
整理关于Bootstrap列表组的慕课笔记
Mar 29 Javascript
vue router 组件的高级应用实例代码
Apr 08 Javascript
详解Angular cli配置过程记录
Nov 07 Javascript
vue.js实现照片放大功能
Jun 23 Javascript
javascript实现搜索筛选功能实例代码
Nov 12 Javascript
antdesign-vue结合sortablejs实现两个table相互拖拽排序功能
Jan 08 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
漂亮但不安全的CTB
2006/10/09 PHP
一个PHP验证码类代码分享(已封装成类)
2011/07/17 PHP
ThinkPHP模板范围判断输出In标签与Range标签用法详解
2014/06/30 PHP
PHP类的声明与实例化及构造方法与析构方法详解
2016/01/26 PHP
PHP编程实现脚本异步执行的方法
2017/08/09 PHP
PHP之认识(二)关于Traits的用法详解
2019/04/11 PHP
JavaScript中实现sprintf、printf函数
2015/01/27 Javascript
使用jQuery在对象中缓存选择器的简单方法
2015/06/30 Javascript
jQuery中$this和$(this)的区别介绍(一看就懂)
2015/07/06 Javascript
Javascript实现鼠标右键特色菜单
2015/08/04 Javascript
JS实现slide文字框缩放伸展效果代码
2015/11/05 Javascript
什么是JavaScript注入攻击?
2016/09/14 Javascript
angularjs中使用ng-bind-html和ng-include的实例
2017/04/28 Javascript
深入研究React中setState源码
2017/11/17 Javascript
bootstrap-table+treegrid实现树形表格
2019/07/26 Javascript
微信小程序实现录音功能
2019/11/22 Javascript
js判断非127开头的IP地址的实例代码
2020/01/05 Javascript
Vue性能优化的方法
2020/07/30 Javascript
Python yield 小结和实例
2014/04/25 Python
django开发之settings.py中变量的全局引用详解
2017/03/29 Python
Python实现的拟合二元一次函数功能示例【基于scipy模块】
2018/05/15 Python
python中sys.argv函数精简概括
2018/07/08 Python
Python学习笔记之pandas索引列、过滤、分组、求和功能示例
2019/06/03 Python
解决python 3 urllib 没有 urlencode 属性的问题
2019/08/22 Python
python如何基于redis实现ip代理池
2020/01/17 Python
如何打包Python Web项目实现免安装一键启动的方法
2020/05/21 Python
python爬取股票最新数据并用excel绘制树状图的示例
2021/03/01 Python
为什么要做架构设计
2015/07/08 面试题
社区交通安全实施方案
2014/03/22 职场文书
教师节学生演讲稿
2014/09/03 职场文书
2014年销售经理工作总结
2014/12/01 职场文书
先进班集体申报材料
2014/12/26 职场文书
初中地理教学反思
2016/02/19 职场文书
2019年中,最受大众欢迎的6本新书
2019/08/07 职场文书
JavaWeb 入门:Hello Servlet
2021/07/16 Java/Android
使用CSS设置滚动条样式
2022/01/18 HTML / CSS