在理论基础篇之后呢,应该就对正则表达式有了一些了解.比如说如何去创建一个正则表达式以及其中的匹配规则等等.那么就开始正则表达式的实战吧!
建议把所有的实例在console窗口敲一遍.例子中展现的只是一部分,配合《正则表达式-理论基础篇》SF地址、原址使用效果更佳哦!
一个手机号码匹配的进化历程
实例代码依托于:RegExpObj.test(String)
,其含义是测试正则表达式与指定字符串是否匹配。成功匹配返回true
第一阶段-字符直接量:匹配自身
先假设一个手机号码为13762571094.
1 2 3 4 5 6
| /13762571094/.test("13783281094"); |
第二阶段-锚点:指定匹配位置
1 2 3
| /^http:/.test("http://www.163.com");//true /^http:/.test("ahttp://www.163.com");//false /^http:/.test("//www.163.com");//false
|
1 2 3 4
| /.jpg$/.test("1.jpg"); |
1 2
| /\bis\b/.test("this"); |
1 2 3 4 5 6 7 8
| /^13762571094$/.test("13762571094"); |
第三阶段-字符类:匹配一类字符中的一个
[abc]
:a或b或c。[0-9]
:一个数字[^0-9]
:非数字的一个字符。[a-z]
:一个字母.
:任一字符(换行符除外)
1 2 3 4 5 6
| [0-9]/.test("123") |
- 了解了字符类后,我们就可以进行第二次进化(50%)。此时就能匹配一个手机号码啦!
1 2 3
| /^1[0-9][0-9][0-9][0-9][0-9][0-9][0-9][0-9][0-9][0-9]$/.test("13762571094"); |
元字符-具有特殊意义的字符
其实我们已经在前面使用过它啦
^
、$
、\b
。\d
:[0-9]
。\D
:[^\d]
\s
:空白符。\S
:[^\s]
\w
:[A-Za-z0-9_]
。\W
:[^\w]
- 了解了元字符后我们就可以进行第二次进化(100%)了。
1 2 3 4
| /^1\d\d\d\d\d\d\d\d\d\d$/.test("13762571094"); |
第四阶段-量词:出现的次数
{n,m}
:n到m次。?
:{0,1}
+
:{1,}
。*
:{0,}
1 2 3 4 5 6
| /\d*/.test("abc");//true /\d+/.test("abc");//false /\d+/.test("1abc");//true /^https?:/.test("http://www.163.com");//true /^https?:/.test("//www.163.com");//true /^https?:/.test("httpss://www.163.com");//false
|
- 此时我们的匹配手机号码的正则表达式就到了最后阶段了
1 2 3 4
| /^1\d{10}$/.test("1376257109x"); |
需要注意的点
- 这里匹配的情况是最简单的情况,并没有特别完美,比如限制开头第二位数字的范围:188,158通过,而123,191,不通过等等。
- 可利用多选分支,例如:
/^1[3|5][0-9]{9}$|^18\d{9}$/
。不过现在虚拟运营商的加入,号码段变多了,所以直接用最简单的方法,也没事。
邮箱的匹配
/thi(c|n)k/
===thi[cn]k
\.(png|jpg|jpeg|gif)$
:检测一个文件是不是图片文件.
多选分支:网易邮箱的匹配
元字符的问题
/^http:/\/\/
../@163\.com$/
使用多选分支。
1 2 3
| /(\w+)@(163|126|188)\.com$/.test("guo啊圣诞节了@163acom") |
分组-邮箱的匹配
这里需要思考几个问题.
- 在@前能出现哪些东西?这里使用
(\w+\.)*
来匹配出现.
的情况,表示出现0次或多次因为.
后不能紧跟@,所以后面紧跟\w+
匹配普通的字母数字情况。 - @后出现的邮箱后缀并不固定所以使用
\w+
来匹配。 - 最后考虑域名结尾的级联情况所以用
(\.\w+)+
1 2 3 4
| /^(\w+\.)*\w+@\w+(\.\w+)+$/.test("guo啊圣诞节了@163acom") |
捕获
- 保存匹配到的字符串,日后再用
()
:捕获/(\w+)@(163|126|188)\.com$/
- (?:):不捕获
/(\w+)@(?:163|126|188)\.com$/
- 使用:
获取匹配的字符串:String.match(regexp)
1 2 3 4 5 6 7 8 9 10 11 12 13
| var url = 'http://blog.163.com/album?id=1#comment'; var reg = /^(https?:)\/\/([^\/]+)(\/[^\?]*)?(\?[^#]*)?(#.*)?$/;
|
替换一个子串:str.replace(regexp/substr,replacement)
1 2 3 4 5 6
| var str = "the price of tomato is 5, the price of apple is 10." str.replace(/(\d+)/,"$1.00") "the price of tomato is 5.00, the price of apple is 10."
|
1 2 3 4 5 6 7 8 9 10 11
| var html = '<label>网址:</label><input placeholder="以http://起始">'; html = html.replace(/[<>]/g, function(m0){ switch(m0){ case '<': return '<'; case '>': return '>'; } });
|
更强大的检索 - regexpObj.exec(str)
- 更详尽的结果:index
- 过程的状态:lastIndex
- 一般用不到,就不详细说明了,有兴趣的自己去了解一下。