详解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 相关文章推荐
javascript 通用简单的table选项卡实现
May 07 Javascript
javascript字符串拼接的效率问题
Dec 25 Javascript
修复ie8&amp;chrome下window的resize事件多次执行
Oct 20 Javascript
如何制作浮动广告 JavaScript制作浮动广告代码
Dec 30 Javascript
js操作iframe的一些方法介绍
Jun 25 Javascript
Ext JS 4实现带week(星期)的日期选择控件(实战一)
Aug 21 Javascript
纯javascript移动优先的幻灯片效果
Nov 02 Javascript
在javascript中创建对象的各种模式解析
May 16 Javascript
Javascript实现跑马灯效果的简单实例
May 31 Javascript
JS实现遍历不规则多维数组的方法
Mar 21 Javascript
layer弹出的iframe层在执行完毕后关闭当前弹出层的方法
Aug 17 Javascript
vuejs简单验证码功能完整示例
Jan 08 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
图象函数中的中文显示
2006/10/09 PHP
PHP时间戳使用实例代码
2008/06/07 PHP
使用VisualStudio开发php的图文设置方法
2010/08/21 PHP
PHP使用CURL实现对带有验证码的网站进行模拟登录的方法
2014/07/23 PHP
php使用session二维数组实例
2014/11/06 PHP
php文件上传及下载附带显示文件及目录功能
2017/04/27 PHP
详解PHP5.6.30与Apache2.4.x配置
2017/06/02 PHP
PHP使用pdo连接access数据库并循环显示数据操作示例
2018/06/05 PHP
PDO::beginTransaction讲解
2019/01/27 PHP
PHP标准库 (SPL)――Countable用法示例
2020/06/05 PHP
javascript &amp;&amp;和||运算法的另类使用技巧
2009/11/28 Javascript
jQuery实现拖拽效果插件的方法
2015/03/23 Javascript
深入理解JavaScript编程中的同步与异步机制
2015/06/24 Javascript
jQuery实现图片向左向右切换效果的简单实例
2016/05/18 Javascript
仿百度换肤功能的简单实例代码
2016/07/11 Javascript
JavaScript中省略元素对数组长度的影响
2016/10/26 Javascript
JS字符串补全方法padStart()和padEnd()
2020/05/27 Javascript
vue实现导航菜单和编辑文本的示例代码
2020/07/04 Javascript
JS实现悬浮球只在一侧滑动并且是横屏状态下
2020/08/19 Javascript
vue项目打包后请求地址错误/打包后跨域操作
2020/11/04 Javascript
jQuery实现购物车全功能
2021/01/11 jQuery
Python实现将文本生成二维码的方法示例
2017/07/18 Python
python 列表删除所有指定元素的方法
2018/04/19 Python
django传值给模板, 再用JS接收并进行操作的实例
2018/05/28 Python
使用OpenCV circle函数图像上画圆的示例代码
2019/12/27 Python
Django与pyecharts结合的实例代码
2020/05/13 Python
pandas实现导出数据的四种方式
2020/12/13 Python
HTML5拖拽文件到浏览器并实现文件上传下载功能代码
2013/06/06 HTML / CSS
夏尔巴人登珠峰品牌:Sherpa Adventure Gear
2018/02/08 全球购物
研究生简历自我评价范文
2014/09/13 职场文书
2014年民政工作总结
2014/11/26 职场文书
售后服务质量承诺书
2015/04/29 职场文书
2015年体育教学工作总结
2015/05/20 职场文书
学雷锋主题班会教案
2015/08/13 职场文书
2016应届毕业生自荐信范文
2016/01/28 职场文书
创业计划书之孕婴生活馆
2019/11/11 职场文书