摘要：正則表達(dá)式基礎(chǔ)實(shí)戰(zhàn)篇在理論基礎(chǔ)篇之后呢應(yīng)該就對(duì)正則表達(dá)式有了一些了解比如說如何去創(chuàng)建一個(gè)正則表達(dá)式以及其中的匹配規(guī)則等等那么就開始正則表達(dá)式的實(shí)戰(zhàn)吧建議把所有的實(shí)例在窗口敲一遍例子中展現(xiàn)的只是一部分配合正則表達(dá)式理論基礎(chǔ)篇地址原址使用效

在理論基礎(chǔ)篇之后呢,應(yīng)該就對(duì)正則表達(dá)式有了一些了解.比如說如何去創(chuàng)建一個(gè)正則表達(dá)式以及其中的匹配規(guī)則等等.那么就開始正則表達(dá)式的實(shí)戰(zhàn)吧!
建議把所有的實(shí)例在console窗口敲一遍.例子中展現(xiàn)的只是一部分,配合《正則表達(dá)式-理論基礎(chǔ)篇》SF地址、原址使用效果更佳哦!

實(shí)例代碼依托于:RegExpObj.test(String)，其含義是測(cè)試正則表達(dá)式與指定字符串是否匹配。成功匹配返回true

先假設(shè)一個(gè)手機(jī)號(hào)碼為13762571094.

最初形態(tài)

/13762571094/.test("13783281094");//false
/13762571094/.test("13762571094");//true

/13762571094/.test("ui13762571094dd");//true
//正則表達(dá)式在匹配時(shí),只要輸出匹配內(nèi)容就返回true,不考慮前面的ui和后面的dd
//最后這種情況顯然不是我們想要的.那么就進(jìn)入下一階段的實(shí)踐吧.

^匹配起始位置

/^http:/.test("http://www.163.com");//true
/^http:/.test("ahttp://www.163.com");//false
/^http:/.test("https://www.163.com");//false

$匹配結(jié)尾位置

/.jpg$/.test("1.jpg");//true
/.jpg$/.test("1.jpg png");//false
/.jpg$/.test("1.png");//false
/.jpg$/.test("regexp.png");//false

:匹配單詞邊界

/is/.test("this");//false
/is/.test("that is reg");//true

在了解錨點(diǎn)之后我們的正則就有了第一次進(jìn)化

/^13762571094$/.test("13762571094");//true

/^13762571094$/.test("ui13762571094dd");//false
//此時(shí)這個(gè)程序就能正確識(shí)別頭尾的字符了.下面我們看看
/^13762571094$/.test("13712345674");//false
/*在試過了多個(gè)號(hào)碼后發(fā)現(xiàn),這個(gè)正則只能識(shí)別這個(gè)標(biāo)準(zhǔn)的手機(jī)號(hào)碼.
這顯然不是我們想要的,而不是識(shí)別一個(gè)手機(jī)號(hào)碼的格式.
在下一階段我們將實(shí)現(xiàn)一個(gè)手機(jī)號(hào)碼的匹配.*/

[abc]:a或b或c。[0-9]:一個(gè)數(shù)字

[^0-9]:非數(shù)字的一個(gè)字符。[a-z]:一個(gè)字母

. :任一字符(換行符除外)

[0-9]/.test("123")//true
/[0-9]/.test("asd")//false
/[^0-9]/.test("asd")//true
/[a-z]/.test("asd")//true
/./.test("allen")//true
/./.test("12")//true

了解了字符類后,我們就可以進(jìn)行第二次進(jìn)化(50%)。此時(shí)就能匹配一個(gè)手機(jī)號(hào)碼啦！

/^1[0-9][0-9][0-9][0-9][0-9][0-9][0-9][0-9][0-9][0-9]$/.test("13762571094");//true
/^1[0-9][0-9][0-9][0-9][0-9][0-9][0-9][0-9][0-9][0-9]$/.test("13712345678");//true
//是不是感覺代碼太長(zhǎng)了呢?[0-9]足足5個(gè)字符呢,為了省力,當(dāng)然不會(huì)就這樣算了.繼續(xù)向下看吧

其實(shí)我們已經(jīng)在前面使用過它啦

^、$、。

d:[0-9]。D:[^d]

s:空白符。S:[^s]

w:[A-Za-z0-9_]。W:[^w]

/d/.test("123");//true
/d/.test("1dsf");//true
/D/.test("1dsf");//true
/D/.test("123");//false
//自己再多去實(shí)驗(yàn)一些例子吧

了解了元字符后我們就可以進(jìn)行第二次進(jìn)化(100%)了。

/^1ffffdffffdffffdd$/.test("13762571094");//true
/^1ffffdffffdffffdd$/.test("13712345678");//true
/^1ffffdffffdffffdd$/.test("1376257109x");//false
//是不是感覺代碼比剛剛短了很多了呢?但這還是不夠,什么事情都阻止不了我想偷懶的心,繼續(xù)學(xué)習(xí)吧.

{n,m}:n到m次。?：{0,1}

+:{1,}。*:{0,}

/d*/.test("abc");//true
/d+/.test("abc");//false
/d+/.test("1abc");//true
/^https?:/.test("http://www.163.com");//true
/^https?:/.test("https://www.163.com");//true
/^https?:/.test("httpss://www.163.com");//false

此時(shí)我們的匹配手機(jī)號(hào)碼的正則表達(dá)式就到了最后階段了

/^1d{10}$/.test("13762571094");//true
/^1d{10}$/.test("13712345678");//true
/^1d{10}$/.test("1376257109x");//false
//到這里手機(jī)號(hào)碼就匹配完成了!

/^http:///../@163.com$/

/http:///.test("http://www.163.com");//true
/@163.com$/.test("abc@163.com");//true
/@163.com$/.test("abc@163acom");//true
/@163.com$/.test("abc@163.com");//true
/@163.com$/.test("abc@163acom");//false

/thi(c|n)k/===thi[cn]k
.(png|jpg|jpeg|gif)$:檢測(cè)一個(gè)文件是不是圖片文件.

/(w+)@(163|126|188).com$/.test("guo啊圣誕節(jié)了@163acom")//false
/(w+)@(163|126|188).com$/.test("guodong111@163acom")//false
/(w+)@(163|126|188).com$/.test("guodong111@163.com")//true

保存匹配到的字符串,日后再用

():捕獲/(w+)@(163|126|188).com$/

(?:):不捕獲/(w+)@(?:163|126|188).com$/

使用:

$1,$2,...

api參數(shù)或返回值

var url = "http://blog.163.com/album?id=1#comment";
var reg = /^(https?:)//([^/]+)(/[^?]*)?(?[^#]*)?(#.*)?$/;
// var reg = /^(https?:)//([^/]+)([^?]*)([^#]*)(.*)$///與上面的正則效果相同.;

var arr = url.match(reg);

//arr[0]為原字符串."http://blog.163.com/album?id=1#comment"
//對(duì)應(yīng)括號(hào)所匹配的字符
var protocol= arr[1]//"http:"
var host= arr[2]//"blog.163.com"
var pathname= arr[3]//"/album"
var search= arr[4]//"?id=1"
var hash= arr[5]//"#comment"

第二個(gè)參數(shù)是字符時(shí)

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."
//使用全局模式
str.replace(/(d+)/g,"$1.00")
"the price of tomato is 5.00, the price of apple is 10.00."

第二個(gè)參數(shù)是函數(shù)時(shí)

var html = "網(wǎng)址:";
html = html.replace(/[<>]/g, function(m0){
    switch(m0){
        case "<":
            return "<";
        case ">":
            return ">";
    }
});
console.log(html);//網(wǎng)址:

更詳盡的結(jié)果:index

過程的狀態(tài):lastIndex

感覺基本用不到..就不說了...喜歡就推薦一下吧^_^