javascript的正则表达式总结
网上正则表达式的教程够多了,但由于javascript的历史比较悠久,也比较古老,因此有许多特性是不支持的。我们先从最简单地说起,文章所演示的正则基本都是perl方式。
元字符
( [ { \ ^ $ | ) ? * + .
预定义的特殊字符
字符 | 正则 | 描述 |
---|---|---|
\t | /\t/ | 制表符 |
\n | /\n/ | 制表符 |
\r | /\r/ | 回车符 |
\f | /\f/ | 换页符 |
\a | /\a/ | alert字符 |
\e | /\e/ | escape字符 |
\cX | /\cX/ | 与X相对应的控制字符 |
\b | /\b/ | 与回退字符 |
\v | /\v/ | 垂直制表符 |
\0 | /\0/ | 空字符 |
字符类
简单类
原则上正则的一个字符对应一个字符,我们可以用[]把它们括起来,让[]这个整体对应一个字符。如
alert(/ruby/.test( "ruby" )); //true alert(/[abc]/.test( "a" )); //true alert(/[abc]/.test( "b" )); //true alert(/[abc]/.test( "c" )); //true alert( "a bat ,a Cat,a fAt bat ,a faT cat" .match(/[bcf]at/gi)); //bat,Cat,fAt,bat,faT,cat |
负向类
也是在那个括号里做文章,前面加个元字符进行取反,表示匹配不能为括号里面的字符。
alert(/[^abc]/.test( "a" )); //false alert(/[^abc]/.test( "b" )); //false alert(/[^abc]/.test( "6" )); //true alert(/[^abc]/.test( "gg" )); //true |
范围类
还是在那个中括号里面做文章。有时匹配的东西过多,而且类型又相同,全部输入太麻烦,我们可以用它。特征就是在中间加了个横线。
组合类
还是在那个中括号里面做文章。允许用中括号匹配不同类型的单个字符。
alert(/[a-f]/.test( "b" )); //true alert(/[a-f]/.test( "k" )); //false alert(/[a-z]/.test( "h" )); //true alert(/[A-Z]/.test( "gg" )); //false alert(/[^H-Y]/.test( "G" )); //true alert(/[0-9]/.test( "8" )); //true alert(/[^7-9]/.test( "6" )); //true |
alert(/[a-m1-5\n]/.test( "a" )) //true alert(/[a-m1-5\n]/.test( "3" )) //true var a = "\n\ " alert(/[a-m1-5\n]/.test(a)) //true alert(/[a-m1-5\n]/.test( "r" )) //false |
预定义类
还是在那个中括号里面做文章,不过它好像已经走到尽头了。由于是中括号的马甲,因此它们还是对应一个字符。
字符 | 等同于 | 描述 |
---|---|---|
. | [^\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] | 非单词字符 |
alert(/\d/.test( "3" )) //true alert(/\d/.test( "w" )) //false alert(/\D/.test( "w" )) //true alert(/\w/.test( "w" )) //true alert(/\w/.test( "司" )) //false alert(/\W/.test( "徒" )) //true alert(/\s/.test( " " )) //true alert(/\S/.test( " " )) //false alert(/\S/.test( "正" )) //true alert(/./.test( "美" )) //true alert(/./.test( " " )) //true var a = "\n\ " alert(/./.test(a)) //true |
量词
由于元字符与特殊字符或字符类或者它们的组合(中括号)甚至它们的马甲(预定义类)都是一对一进行匹配。我们要匹配“司徒正美这个词”,最简单都要/..../,如果长到50多个字符岂不是要死人。因此我们逼切需要一个简单的操作,来处理这数量关系。
简单量词
代码 | 类型 | 描述 |
---|---|---|
? | 软性量词 | 出现零次或一次 |
* | 软性量词 | 出现零次或多次(任意次) |
+ | 软性量词 | 出现一次或多次(至道一次) |
{n} | 硬性量词 | 对应零次或者n次 |
{n,m} | 软性量词 | 至少出现n次但不超过m次 |
{n,} | 软性量词 | 至少出现n次(+的升级版) |
alert(/..../.test( "司徒正美" )) //true alert(/司徒正美/.test( "司徒正美" )) //true alert(/[\u4e00-\u9fa5]{4}/.test( "司徒正美" )) //true alert(/[\u4e00-\u9fa5]{4}/.test( "司徒正美55" )) //true alert(/^[\u4e00-\u9fa5]+$/.test( "正则表达式" )) //true alert(/^[\u4e00-\u9fa5]+$/.test( "正则表达式&*@@" )) //false alert(/\d{6}/.test( "123456" )) //true alert(/[ruby]{2}/.test( "rr" )) //true alert(/[ruby]{2}/.test( "ru" )) //true alert(/[ruby]{2}/.test( "ry" )) //true |
/[\u4e00-\u9fa5]/用于匹配单个汉字。
贪婪量词,惰性量词与支配性量词
贪婪量词,上面提到的所有简单量词。就像成语中说的巴蛇吞象那样,一口吞下整个字符串,发现吞不下(匹配不了),再从后面一点点吐出来(去掉最后一个字符,再看这时这个整个字符串是否匹配,不断这样重复直到长度为零)
隋性量词,在简单量词后加问号。由于太懒了,先吃了前面第一个字符,如果不饱再捏起多添加一个(发现不匹配,就读下第二个,与最初的组成一个有两个字符串的字符串再尝试匹配,如果再不匹配,再吃一个组成拥有三个字符的字符串……)。其工作方式与贪婪量词相反。
支配性量词,在简单量词后加加号。上面两种都有个不断尝试的过程,而支配性量词却只尝试一次,不合口味就算了。就像一个出身高贵居支配地位的公主。但你也可以说它是最懒量词。由于javascript不支持,所以它连出场的机会也没有了。
var re1 = /.*bbb/g; //贪婪 var re2 = /.*?bbb/g; //惰性 // var re3 = /.*+bbb/g;//支配性,javascript不支持,IE与所有最新的标准浏览器都报错 alert(re1.test( "abbbaabbbaaabbbb1234" )+ "" ); //true alert(re1.exec( "abbbaabbbaaabbbb1234" )+ "" ); //null alert( "abbbaabbbaaabbbb1234" .match(re1)+ "" ); //abbbaabbbaaabbbb alert(re2.test( "abbbaabbbaaabbbb1234" )+ "" ); //true alert(re2.exec( "abbbaabbbaaabbbb1234" )+ "" ); //aabbb alert( "abbbaabbbaaabbbb1234" .match(re2)+ "" ); //abbb,aabbb,aaabbb |
分组
到目前为止,我们只能一个字符到匹配,虽然量词的出现,能帮助我们处理一排密紧密相连的同类型字符。但这是不够的,下面该轮到小括号出场了,中括号表示范围内选择,大括号表示重复次数。小括号允许我们重复多个字符。
//分组+量词 alert(/(dog){2}/.test( "dogdog" )) //true //分组+范围 alert( "baddad" .match(/([bd]ad?)*/)) //baddad,dad //分组+分组 alert( "mon and dad" .match(/(mon( and dad)?)/)) //mon and dad,mon and dad, and dad |
反向引用
反向引用标识由正则表达式中的匹配组捕获的子字符串。每个反向引用都由一个编号或名称来标识,并通过“\编号”表示法进行引用。
var color = "#990000" ; / #(\d+)/.test(color); alert(RegExp.$1); //990000 alert(/(dog)\1/.test( "dogdog" )) //true var num = "1234 5678" ; var newNum = num.replace(/(\d{4}) (\d{4})/, "$2 $1" ); alert(newNum) |
候选
继续在分组上做文章。在分组中插入管道符(“|”),把它划分为两个或多个候多项。
var reg = /(red|black|yellow)!!/; alert(reg.test( "red!!" )) //true alert(reg.test( "black!!" )) //true alert(reg.test( "yellow!!" )) //true |
非捕获性分组
并不是所有分组都能创建反向引用,有一种特别的分组称之为非捕获性分组,它是不会创建反向引用。反之,就是捕获性分组。要创建一个非捕获性分组,只要在分组的左括号的后面紧跟一个问号与冒号就行了。
var color = "#990000" ; / #(?:\d+)/.test(color); alert(RegExp.$1); //"" |
题目,移除所有标签,只留下innerText!
var html = "<p><a href='http://www.cnblogs.com/rubylouvre/'>Ruby Louvre</a>by <em>司徒正美</em></p>" ; var text = html.replace(/<(?:.|\s)*?>/g, "" ); alert(text) |
注意:javascript不存在命名分组
前瞻
继续在分组内做文章。前瞻与后瞻其实都属于零宽断言,但javascript不支持后瞻。
零宽断言 | ||
---|---|---|
正则 | 名称 | 描述 |
(?=exp) | 正向前瞻 | 匹配exp前面的位置 |
(?!exp) | 负向前瞻 | 匹配后面不是exp的位置 |
(?<=exp) | 正向后瞻 | 匹配exp后面的位置不支持 |
(?<!exp) | 负向后瞻 | 匹配前面不是exp的位置不支持 |
正向前瞻用来检查接下来的出现的是不是某个特定的字符集。而负向前瞻则是检查接下来的不应该出现的特定字符串集。零宽断言是不会被捕获的。
var str1 = "bedroom" ; var str2 = "bedding" ; var reBed = /(bed(?=room)) ///在我们捕获bed这个字符串时,抢先去看接下来的字符串是不是room alert(reBed.test(str1)); //true alert(RegExp.$1) //bed alert(RegExp.$2 === "" ) //true alert(reBed.test(str2)) //false |
var str1 = "bedroom" ; var str2 = "bedding" ; var reBed = /(bed(?!room))/ //要来它后面不能是room alert(reBed.test(str1)) //false alert(reBed.test(str2)) //true |
题目,移除hr以外的所有标签,只留下innerText!
var html = "<p><a href='http://www.cnblogs.com/rubylouvre/'>Ruby Louvre</a></p><hr/><p>by <em>司徒正美</em></p>" ; var text = html.replace(/<(?!hr)(?:.|\s)*?>/ig, "" ) alert(text) //Ruby Louvre<hr/>by 司徒正美 |
边界
一个要与字符类合用的东西。
边界 | ||
---|---|---|
正则 | 名称 | 描述 |
^ | 开头 | 注意不能紧跟于左中括号的后面 |
$ | 结尾 | |
\b | 单词边界 | 指[a-zA-Z_0-9]之外的字符 |
\B | 非单词边界 |
题目,设计一个字符串原型方法,实现首字母大写!
var a = "ruby" ; String.prototype.capitalize = function () { return this .replace(/^\w/, function (s) { return s.toUpperCase(); }); } alert(a.capitalize()) //Ruby |
单词边界举例。要匹配的东西的前端或未端不能为英文字母阿拉伯字数字或下横线。
var str = "12w-eefd&efrew" ; alert(str.match(/\b\w+\b/g)) //12w,eefd,efrew |
实例属性 | 描述 |
---|---|
global | 是当前表达式模式首次匹配内容的开始位置,从0开始计数。其初始值为-1,每次成功匹配时,index属性都会随之改变。 |
ignoreCase | 返回创建RegExp对象实例时指定的ignoreCase标志(i)的状态。如果创建RegExp对象实例时设置了i标志,该属性返回True,否则返回False,默认值为False。 |
lastIndex | 是当前表达式模式首次匹配内容中最后一个字符的下一个位置,从0开始计数,常被作为继续搜索时的起始位置,初始值为-1, 表示从起始位置开始搜索,每次成功匹配时,lastIndex属性值都会随之改变。(只有使用exec()或test()方法才会填入,否则为0) |
multiLine | 返回创建RegExp对象实例时指定的multiLine标志(m)的状态。如果创建RegExp对象实例时设置了m标志,该属性返回True,否则返回False,默认值为False。 |
source | 返回创建RegExp对象实例时指定的表达式文本字符串。 |
var str = "JS's Louvre" ; var reg = /\w/g; alert(reg.exec(str)); //J alert(reg.lastIndex); //1 alert(reg.exec(str)); //S alert(reg.lastIndex); //2 alert(reg.exec(str)); //s alert(reg.lastIndex); //4 alert(reg.exec(str)); //L alert(reg.lastIndex); //6 |
本文转载自:http://www.cnblogs.com/rubylouvre/archive/2010/03/09/1681222.html
javascript的正则表达式总结的更多相关文章
- 详解Javascript中正则表达式的使用
正则表达式用来处理字符串特别好用,在JavaScript中能用到正则表达式的地方有很多,本文对正则表达式基础知识和Javascript中正则表达式的使用做一个总结. 第一部分简单列举了正则表达式在Ja ...
- javascript类型系统——正则表达式RegExp类型
× 目录 [1]对象 [2]实例属性 [3]静态属性[4]实例方法 前面的话 前面已经介绍过javascript中正则表达式的基础语法.javascript的RegExp类表示正则表达式,String ...
- JavaScript正则表达式详解(二)JavaScript中正则表达式函数详解
二.JavaScript中正则表达式函数详解(exec, test, match, replace, search, split) 1.使用正则表达式的方法去匹配查找字符串 1.1. exec方法详解 ...
- javascript中正则表达式的基础语法
× 目录 [1]定义 [2]特点 [3]元字符[4]转义字符[5]字符组[6]量词[7]括号[8]选择[9]断言[10]模式[11]优先级[12]局限性 前面的话 正则表达式在人们的印象中可能是一堆无 ...
- 深入浅出的javascript的正则表达式学习教程
深入浅出的javascript的正则表达式学习教程 阅读目录 了解正则表达式的方法 了解正则中的普通字符 了解正则中的方括号[]的含义 理解javascript中的元字符 RegExp特殊字符中的需要 ...
- JavaScript验证正则表达式大全
JavaScript验证正则表达式大全,搜集最全的JavaScript验证正则表达式,开始查看吧,这里的都是正则表达式的例子,具体和函数结合的使用方法,还请查看下篇文章<JavaScript使用 ...
- 如何使用JavaScript和正则表达式进行数据验证
利用客户端JavaScript的优势,JavaScript中的正则表达式可以简化数据验证的工作,下面与大家分享下如何使用JavaScript和正则表达式进行数据验证,感兴趣的朋友可以参考下哈 数据验证 ...
- JavaScript常用正则表达式与应用(一)
JavaScript的String类和RegExp对象类都定义了相关方法使用正则表达式进行模式匹配,本文将以连载方式介绍JavaScript常用正则表达式与相关应用,欢迎交流 本节是连载一,首先介绍J ...
- javascript基础-正则表达式
概述 正则表达式被用来检索.替换那些符合某个模式的文本 标准正则表达式语法 javascript对正则表达式的支持 替代写法 逆向环视 //需求:替换mpre.cnsuning.com为${pre}, ...
- JavaScript中正则表达式判断匹配规则以及常用的方法
JavaScript中正则表达式判断匹配规则以及常用的方法: 字符串是编程时涉及到的最多的一种数据结构,对字符串进行操作的需求几乎无处不在. 正则表达式是一种用来匹配字符串的强有力的武器.它的设计思想 ...
随机推荐
- javascript中bind()、call()、apply()的使用
一直以来对bind().apply().call()这三个方法都模模糊糊的,现在有时间详细的看看这三个方法,并记录下来. bind() 参考文档:https://developer.mozilla.o ...
- Django:ContentType组件
一.项目背景 二.版本一 三.版本二 三.终极版(使用ContentType) 一.项目背景 luffy项目,有课程有学位课(不同的课程字段不一样),价格策略 问题:1.如何设计表结构,来表示这种规则 ...
- MyBatis 3.0_[tp-24-25]_映射文件_参数处理_#与$取值区别_#{}更丰富的用法
笔记要点出错分析与总结 /**================Mybatis参数值的获取:#和$符号的区别=============== * #{}:可以获得map中的值或者pojo对象属性的值; * ...
- 1227:Ride to Office
题目来源:http://ybt.ssoier.cn:8088/problem_show.php?pid=1227 1227:Ride to Office 时间限制: 1000 ms 内 ...
- webpack 配置react脚手架(三):eslint 及优化
首先谨记 eslint的官网: http://eslint.cn/ 1 安装eslint npm i eslint -D 2.在根目录下新建文件 .eslintrc { "extends ...
- Vue界面中关于APP端回调方法问题
在混合开发中,HTML界面经常性的需要调用APP端提供的原生方法,而且在很多时候,APP端需要各种回调,如果将所有的回调方法写在内部,不是很方便,而且有些时候,APP端需要定义一些主动触发HTML界面 ...
- SecureCRT中解决乱码的问题
SecureCRT中文乱码的问题,解决方法如下: 打开Option菜单,点击Session Options- 在Appearance外观这里,选择编码--UTF-8 一定要记得先保存! ...
- redis 与 序列化
概念 序列化:把对象转化为可传输的字节序列过程称为序列化. 反序列化:把字节序列还原为对象的过程称为反序列化. 为什么需要序列化 序列化最终的目的是为了对象可以跨平台存储,和进行网络传输.而我们进行跨 ...
- Java位运算总结:位运算用途广泛
前天几天研究了下JDK的Collection接口,本来准备接着研究Map接口,可是一查看HashMap类源码傻眼咯,到处是位运算实现,所以我觉得还是有必要先补补位运算知识,不然代码看起来有点费力.今天 ...
- Codeforces Round #597 (Div. 2) B. Restricted RPS
链接: https://codeforces.com/contest/1245/problem/B 题意: Let n be a positive integer. Let a,b,c be nonn ...