javascript正则表达式教程
正则表达式很可怕很可怕,但是,一旦你记住并且明白了这些符号的意义,那么这些恐惧就会马上消失。如果你现在心中还有那份恐惧感,那就赶紧往下看吧。
基础知识
学好正则表达式子的关键一步就是花一点时间记住这些符号。这是最好的建议了。坐下来,好好记一记,很快的:
- .:会匹配任何字符,在dotall模式为false的时候不会匹配换行符。
- *:匹配0个或者多个上面的那个字符可以匹配的
- +:匹配一个或者多个上面那个字符可以匹配的
- ?:上述可匹配字符可选,0个或1个
- \d:匹配一个数字
- \w:匹配任何字符(字母数字和下划线)
- [xyz]:匹配xyz中的一个
- [xyz]+:匹配xyz中的一个或者多个
- $:匹配行尾
- ^:匹配行首
- [^a-z]:当^在字符集里面的时候,表示不匹配,这个就表示匹配除了小写字母以外的字符
恩,这个很枯燥,但是还是得记住,必须的。
正则表达式工具
当你的正则表达式不能正常工作的时候(无论是他应该工作还是你觉得他应该工作),你真想把头发都扯掉。这个工具很有意思RegExr Desktop app,不光可以实时的检测,还有一个侧栏,提供一些常用符号的解释。
正则表达式 test()方法
这个方法接受一个字符串的参数,然后返回一个bool值来表明是否匹配。如果你不需要对匹配结果做特殊的处理-比如验证用户名-那么test()方法就够用了。
1 2 |
var username = 'johnsmith'; alert(/[a-zA-Z_-]+/.test(username)); //return true; |
上面的例子我们声明的正则表达式用来匹配大小写字母以及_和-。我们用方括号将这个包起来,表示要匹配的字符集。后面的’+'号表示匹配字符集中的一个或者多个,然后通过test()方法来检测,因为我们的用户名johnsmith符合规则,所以返回为true。
正则表达式 split()方法
你可能比较熟悉split()方法了。他接受一个正则表达式的参数,用来确定在哪里进行分割,当然用字符串做参数也可以。
1 2 |
var str = 'this is my string'; alert(str.split(/\s/)); //alerts "this,is,my,string" |
传入\s表示要匹配空格,我们将字符串分割为一个数组,如果你要访问某一个,那么可以明确指出:
1 2 |
var str = 'this is my string'; alert(str.spli(/\s/)[3]); //alerts string |
正则表达式 replace()方法
跟你认为的一样,replace()方法就是去替换一段文本的,替换的参数可以是字符串也可以是正则表达式。
示例1
如果你想把’hello world’替换为’hello universe’,那么可以这样做:
1 2 3 |
var str = 'Hello,World!'; str = str.replace(/World/,'Universe'); alert(str); |
你可能会问,为什么不直接使用.replace()方法呢,因为这个方法不会复写本来的变量,所以需要重新赋值一下。
示例2
另外一个例子,想象这样的场景,为了安全起见,我们需要对用户输入的内容进行转义,比如我们需要移除那些符号,引号,分号等等。这样使用正则就很方便了。
1 2 3 |
var username = 'J;ohnSmith;@%'; username = username.replace(/[^A-Za-z\d_-]+/, ''); alert(username); // JohnSmith;@% |
根据最后alert的内容,有人可能认为我们的代码有问题。其实不是的,J后面的那个分号还是被移除了,如果需要移除字符串中的所有符号,我们需要在最后的/后面加一个g参数。
1 2 3 |
var username = 'J;ohnSmith;@%'; username = username.replace(/[^A-Za-z\d_-]+/g, ''); alert(username); // JohnSmith |
经过这样的处理之后,就去掉了多余的字符了,注意方括号里面的那个^符号,他表示非。真个正则表达式的意思就是匹配所有A-Z、a-z、以及-和下划线_之外的字符,然后将他们替换为空。
正则表达式 match()方法
与test()方法不同的是,match()会返回一个匹配到的字符串的数组。
示例1
1 2 |
var name = 'JeffreyWay'; alert(name.match(/e/)); //alerts "e" |
我们注意到,这个字符串中有两个e,但是最后只是alert出来一个,因为缺少了g参数,我们加上之后看看。
1 2 |
var name = 'JeffreyWay'; alert(name.match(/e/g)); //alerts "e,e" |
如果我们想alert某一个具体的,那么可以:
1 2 |
var name = 'JeffreyWay'; alert(name.match(/e/g)[1]); //alerts "e" |
示例2
我们来看看另外一个例子来加深一下理解。
1 2 |
var string = 'This is just a string with some 12345 and some !@#$ mixed in.'; alert(string.match(/[a-z]+/gi)); // alerts "This,is,just,a,string,with,some,and,some,mixed,in" |
在这个例子中,我们的正则表达式要匹配的是所有的字母,i参数表示忽略大小写,g参数表示全局查找。所以最后alert的就是字符串中所有的单词。如果我们输入要alert的索引值,那么就会输出相对应的单词。
1 2 3 |
var string = 'This is just a string with some 12345 and some !@#$ mixed in.'; var matches = string.match(/[a-z]+/gi); alert(matches[2]); // alerts "just" |
1 |
分割email地址
为了练习一下,我们来尝试分割一个email地址―rocker@rockux.com―来取出用户名rocker和本站地址rockux.com。
1 2 |
var email = 'rocker@rockux.com'; alert(email.replace(/([a-z\d_-]+)@([a-z\d_-]+)\.[a-z]{2,4}/ig, '$1, $2')); // alerts "rocker, rockux"; |
如果你之前对于正则表达式不是很熟悉,那么这个看着可能有点恐怖,不过没关系,我们一点一点来分解。
.replace(/[a-z\d_-]+)
从中间开始,我们去匹配所有的字母数字下划线和-,然后使用+号来匹配多个,我们需要访问这个值,所以用括号括起来。这样我们在后面就可以引用到。
@([a-z\d-_]+)
然后去匹配@字符,以及他后面的字母数字下划线和-,同样的,我们用括号括起来,一会要访问他。
\.[a-z]{2,4}/ig
这一段表示用来匹配后面的域名类型,ig表示全局匹配并且忽略大小写。在大括号中的数字表示需要匹配的前面字符的起始和结束个数。
‘$1,$2′)
这一部分表示replace方法的第二个参数,用来输入需要替换成为的字符。这里我们使用正则表达式中存储的变量,在这个例子中,$1表示rocker $2表示rockux。
转载请注明:
作者:RockUX-WEB前端
出自:javascript正则表达式教程
建议继续学习:
- 统计最近用过的linux命令 (阅读:5237)
- grep 正则表达式选项要记得转义 (阅读:5093)
- 正则表达式基础 (阅读:4945)
- 正则表达式的与或非 (阅读:4588)
- 学习Grep,Sed中的正则 (阅读:3910)
- URL正则表达式 (阅读:3479)
- PHP 正则里面的两个重要技巧 (阅读:3363)
- 正则表达式简要入门 (阅读:3367)
- 正则表达式简介及使用 (阅读:3191)
- 正则转义符汇总 (阅读:3197)
扫一扫订阅我的微信号:IT技术博客大学习
- 作者:RockUX 来源: RockUX | WEB、前端、JavaScript、PHP
- 标签: 正则
- 发布时间:2011-06-23 13:42:01
- [54] IOS安全–浅谈关于IOS加固的几种方法
- [52] android 开发入门
- [52] 如何拿下简短的域名
- [51] 图书馆的世界纪录
- [49] Go Reflect 性能
- [49] Oracle MTS模式下 进程地址与会话信
- [47] 【社会化设计】自我(self)部分――欢迎区
- [46] 读书笔记-壹百度:百度十年千倍的29条法则
- [37] 程序员技术练级攻略
- [29] 视觉调整-设计师 vs. 逻辑