在理论基础篇之后呢,应该就对正则表达式有了一些了解.比如说如何去创建一个正则表达式以及其中的匹配规则等等.那么就开始正则表达式的实战吧!
建议把所有的实例在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
- 一般用不到,就不详细说明了,有兴趣的自己去了解一下。