详解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 相关文章推荐
js 变量类型转换常用函数与代码[比较全]
Dec 01 Javascript
jQuery队列控制方法详解queue()/dequeue()/clearQueue()
Dec 02 Javascript
当鼠标移动时出现特效的JQuery代码
Nov 08 Javascript
js弹窗返回值详解(window.open方式)
Jan 11 Javascript
自写的jQuery异步加载数据添加事件
May 15 Javascript
Bootstrap每天必学之表格
Nov 23 Javascript
JavaScript位移运算符(无符号) &gt;&gt;&gt; 三个大于号 的使用方法详解
Mar 31 Javascript
js实现图片切换(动画版)
Dec 25 Javascript
微信小程序 引用其他js文件实现代码
Feb 22 Javascript
以BootStrap Tab为例写一个前端组件
Jul 25 Javascript
详解如何在你的Vue项目配置vux
Jun 04 Javascript
详解vue-template-admin三级路由无法缓存的解决方案
Mar 10 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(5) 类和对象
2010/02/16 PHP
php获取当前网址url并替换参数或网址的方法
2010/06/06 PHP
PHP 数组基本操作方法详解
2016/06/17 PHP
php array_slice 取出数组中的一段序列实例
2016/11/04 PHP
PHP二维关联数组的遍历方式(实例讲解)
2017/10/18 PHP
自己开发Dojo的建议框架
2008/09/24 Javascript
JavaScript之引用类型介绍
2012/08/10 Javascript
javascript实现des解密加密全过程
2014/04/03 Javascript
jQuery大于号(&gt;)选择器的作用解释
2015/01/13 Javascript
非常酷炫的Bootstrap图片轮播动画
2016/05/27 Javascript
jQuery on()方法绑定动态元素的点击事件无响应的解决办法
2016/07/07 Javascript
Angular-Touch库用法示例
2016/12/22 Javascript
easyui 中的datagrid跨页勾选问题的实现方法
2017/01/18 Javascript
纯js模仿windows系统日历
2017/02/04 Javascript
原生js轮播特效
2017/05/18 Javascript
react-native之ART绘图方法详解
2017/08/08 Javascript
vue+swiper实现组件化开发的实例代码
2017/10/26 Javascript
基于Angularjs-router动态改变Title值的问题
2018/08/30 Javascript
如何解决日期函数new Date()浏览器兼容性问题
2019/09/11 Javascript
[07:20]2014DOTA2西雅图国际邀请赛 选手讲解积分赛第二天
2014/07/11 DOTA
django开发之settings.py中变量的全局引用详解
2017/03/29 Python
利用Python实现网络测试的脚本分享
2017/05/26 Python
基于DataFrame改变列类型的方法
2018/07/25 Python
python Flask 装饰器顺序问题解决
2018/08/08 Python
对matplotlib改变colorbar位置和方向的方法详解
2018/12/13 Python
Python 3 判断2个字典相同
2019/08/06 Python
Python grequests模块使用场景及代码实例
2020/08/10 Python
python3中编码获取网页的实例方法
2020/11/16 Python
LUISAVIAROMA德国官网:时尚奢侈品牌购物网站
2020/11/12 全球购物
历史学专业个人的自我评价
2013/10/13 职场文书
大学学生会竞选演讲稿
2014/04/25 职场文书
群众路线教育实践活动调研报告
2014/11/03 职场文书
2014年政协工作总结
2014/12/09 职场文书
大学生毕业评语
2014/12/31 职场文书
2015年企业工作总结范文
2015/04/28 职场文书
介绍信怎么写
2015/05/05 职场文书