老生常谈JavaScript 正则表达式语法

 更新时间:2016年08月20日 09:23:27   投稿:jingxian  
下面小编就为大家带来一篇老生常谈JavaScript 正则表达式语法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧

JavaScript定义正则表达式有两种方法。

1.RegExp构造函数

var pattern = new RegExp("[bc]at","i");

它接收两个参数:一个是要匹配的字符串模式,另一个是可选的标志字符串。

2.字面量

var pattern = /[bc]at/i;

正则表达式的匹配模式支持三种标志字符串:

g:global,全局搜索模式,该模式将被应用于所有字符串,而并非搜索到第一个匹配项就停止搜索;

i:ingore case,忽略字母大小写,即在确定匹配项时忽略模式和字符串大小写;

m:multiple lines,多行模式,即在搜索到达一行文本末尾时会继续查找下一行是否有匹配项。

这两种创建正则表达式方法的不同之处在于,正则表达式字面量始终会共享同一个RegExp实例,而使用构造函数创建的每一个新RegExp实例都是新实例。

元字符

元字符是拥有特殊意义的字符,正则表达式的元字符主要有:

( [ { \ ^ $ | ) ? * + .  

在不同的组合中元字符有其不同的意义。

预定义特殊字符

字符类  简单类

一般情况下正则表达式一个字符对应字符串一个字符,但我们可以使用[]来构建一个简单的类,来表示符合某一特征的一类字符。例如:

[abc]可以匹配方括号中的a、b、c或其任意组合的字符。

反向类

既然[]可以构建一个类,那么自然就会联想到与之对应的不包含括号中内容的类,这个类叫做反向类,例如[^abc]就可以匹配不是a或b或c的字符。

范围类

有时候一个一个字符匹配太麻烦而且匹配的类型也相同,此时我们可以使用"-"连接线来表示某个闭区间之间的内容,例如匹配所有小写字母可以使用[a-z],如下:

匹配所有的0到9简直的任意数字可以使用[0-9]表示:

预定义类

对于如上我们创建的几个类,正则表达式为我们提供了几个常用的预定义类来匹配常见的字符,如下:

字符   等价类   含义
.   [^\n\r] 匹配除了回车符和换行符之外的所有字符
\d [0-9] 数字字符
\D [^0-9] 非数字字符
\s [\t\n\x0B\f\r] 空白字符
\S   [^\t\n\x0B\f\r] 非空白字符
\w [a-zA-Z_0-9] 单词字符(字母、数字和下划线)
\W [^a-zA-Z_0-9] 非单词字符

量词

上面的方法匹配字符都是一对一匹配的,如果某个字符连续出现多次按照上面的方法匹配会非常麻烦,因此我们想有没有其它方法可以直接匹配多次重复出现的字符。正则表达式为我们提供了一些量词,如下:

字符   含义  
? 出现零次或一次(最多一次)
+ 出现一次或多次(至少一次)
* 出现零次或多次(任意次)
{n} 出现n次
{n,m} 出现n到m次
{n,} 至少出现n次

贪婪模式与非贪婪模式

对于{n,m}这种匹配方式,到底是匹配n个还是匹配m个呢?这就涉及到匹配模式的问题。默认情况下,量词是尽可能多的匹配字符,也就是所谓的贪婪模式,例如:

var num = '123456789'; 
num.match(/\d{2,4}/g); //[1234]、[5678]、[9] 

与贪婪模式对于的是非贪婪模式,只需要在量词之后加"?"即可,例如{n,m}?,就是按照最少的字符匹配,如下: 

var num = '123456789'; 
num.match(/\d{2,4}?/g); //[12]、[34]、[56]、[78]、[9] 

分组

量词只能是单个字符匹配多次,如果我们希望匹配某一组字符多次呢?正则表达式中小括号可以定义一个字符串整体为一个分组。

我们想要匹配apple这个单词出现4次可以这样匹配(apple){4},如下:

如果想要匹配apple或orange出现4次,可以插入管道符"|",例如:

(apple|orange){4}

如果使用分组的正则表达式中出现多个小括号即多个分组,那么匹配结果就会把匹配项也分组并编号,例如:

(apple)\d+(orange)

如果我们不希望捕获某些分组,只需要在分组的小括号前面紧跟一个问号和冒号即可,例如:

(?:apple)\d+(orange)

边界

正则表达式也为我们提供了几个常用的边界匹配字符,例如:

字符 含义
^ 以xx开头
$ 以xx结尾
\b 单词边界,指[a-zA-Z_0-9]之外的字符
\B 非单词边界

其中单词边界匹配的是一个位置,这个位置的一侧是构成单词的字符,但另一侧为非单词字符、字符串的开始或结束位置。

前瞻

前瞻用来匹配接下来出现的是或不是某一个特定的字符集。

表达式 含义
exp1(?=exp2) 匹配后面是exp2的exp1
exp1(?!exp2) 匹配后面不是exp2的exp1

看一个例子:

apple(?=orange)

(/apple(?=orange)/).test('appleorange123'); //true 
(/apple(?=orange)/).test('applepear345'); //false 

再看另一个例子:

apple(?!orange)

(/apple(?!orange)/).test('appleorange123'); //false 
(/apple(?!orange)/).test('applepear345'); //true 

以上这篇老生常谈JavaScript 正则表达式语法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • javascript中href和replace的比较(详解)

    javascript中href和replace的比较(详解)

    下面小编就为大家带来一篇javascript中href和replace的比较(详解)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-11-11
  • HTML5+setCutomValidity()函数验证表单实例分享

    HTML5+setCutomValidity()函数验证表单实例分享

    本文给大家分享的是在HTML5中结合setCutomValidity()函数实现验证表单的实例,非常的时间实用,这里推荐给大家,有需要的小伙伴可以参考下。
    2015-04-04
  • JS实现仿百度文库评分功能

    JS实现仿百度文库评分功能

    本文给大家分享基于js实现仿百度文库评分功能,代码简单易懂,非常不错,具有参考借鉴价值,需要的的朋友参考下吧
    2017-01-01
  • JS添加删除DIV的简单实例

    JS添加删除DIV的简单实例

    下面小编就为大家带来一篇JS添加删除DIV的简单实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-07-07
  • JS跨域解决方案之使用CORS实现跨域

    JS跨域解决方案之使用CORS实现跨域

    正常使用AJAX会需要正常考虑跨域问题,所以伟大的程序员们又折腾出了一系列跨域问题的解决方案,如JSONP、flash、ifame、xhr2等等。本文给大家介绍JS跨域解决方案之使用CORS实现跨域,感兴趣的朋友参考下吧
    2016-04-04
  • javascript实现tabs选项卡切换效果(自写原生js)

    javascript实现tabs选项卡切换效果(自写原生js)

    常用的页面效果有弹出层效果,无缝滚动效果,选项卡切换效果,接下来与大家分享一款自己用原生javascript写的选项卡切换效果,感兴趣的朋友可以参考下哈
    2013-03-03
  • 小程序根据手机机型设置自定义底部导航距离

    小程序根据手机机型设置自定义底部导航距离

    这篇文章主要为大家详细介绍了小程序根据手机机型设置自定义底部导航距离,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-06-06
  • 微信小程序轮播图swiper代码详解

    微信小程序轮播图swiper代码详解

    swiper组件是滑块视图容器,主要用来做图片轮播。这篇文章主要给大家介绍了关于微信小程序轮播图swiper代码的相关资料,需要的朋友可以参考下
    2020-12-12
  • 详解微信小程序缓存--缓存时效性

    详解微信小程序缓存--缓存时效性

    这篇文章主要介绍了微信小程序缓存时效性,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-05-05
  • 把input初始值不写value的具体实现方法

    把input初始值不写value的具体实现方法

    比如制作一个最常见的,input初始值,一般以前,我都只是写在input的value里,要把初始值单独写出来,就用<span>标签写,定位在input上,让它单击和input获焦上都消失
    2013-07-07

最新评论