正則表達(dá)式是一個(gè)很牛逼的東東,今天在這里只是簡(jiǎn)單的給剛剛接觸JS的人普及一下,里面若有爭(zhēng)議的地方歡迎大家留言!
1.1 什么是正則表達(dá)式
? 正則表達(dá)式(regular expression)是一個(gè)描述字符模式的對(duì)象,ECMAScript的RegExp 類表示正則表達(dá)式,而String和RegExp都定義了使用正則表達(dá)式進(jìn)行強(qiáng)大的模式匹配和文本檢索與替換的函數(shù)。
? 正則表達(dá)式用于對(duì)字符串模式匹配及檢索替換,是對(duì)字符串執(zhí)行模式匹配的強(qiáng)大工具。
1.2 正則表達(dá)式的作用
? 正則表達(dá)式主要用來驗(yàn)證客戶端的輸入數(shù)據(jù)。
? 用戶填寫完表單單擊按鈕之后,表單就會(huì)被發(fā)送到服務(wù)器,在服務(wù)器端通常會(huì)用PHP、ASP.NET、JSP等服務(wù)器腳本對(duì)其進(jìn)行進(jìn)一步處理。因?yàn)榭蛻舳蓑?yàn)證,可以節(jié)約大量的服務(wù)器端的系統(tǒng)資源,并且提供更好的用戶體驗(yàn)。
二、創(chuàng)建正則表達(dá)式==(123)==
要使用正則表達(dá)式,必須先創(chuàng)建正則表達(dá)式對(duì)象,有2種創(chuàng)建對(duì)象的方式:
2.1 方式1:使用關(guān)鍵字new創(chuàng)建
var patt = new RegExp(pattern,modifiers);
參數(shù)1:正則表達(dá)式的模式。字符串形式
參數(shù)2:模式修飾符。用于指定全局匹配、區(qū)分大小寫的匹配和多行匹配
<script type="text/javascript"> /* 創(chuàng)建了一個(gè)正則表達(dá)式 參數(shù)1:模式是:girl,意思是說可以匹配 "girl"這樣的字符串 參數(shù)2:模式修飾符:gi g代表全局匹配 i代表不區(qū)分大小寫 */ var pa = new RegExp("girl", "gi"); //測(cè)試參數(shù)中的字符串"你好我的girl" 是否與匹配模式匹配。 var isExist = pa.test("你好我的girl"); // 在本例中,是匹配的,這個(gè)字符串包含girl,所以返回true alert(isExist); //true</script>
2.2 方式2:使用正則表達(dá)式直接量
var pa = /pattern/modifiers;
兩個(gè)/中間的表示正則表達(dá)式的模式,最后一個(gè)/的后面是模式修飾符
例如:上面的例子可以這樣寫 var pa = /girl/gi;
注意:這個(gè)時(shí)候模式和模式修飾符都能再添加雙引號(hào)或單引號(hào)
<script type="text/javascript"> var pa = /girl/gi; alert(pa.test("厲害了我的girl")); //true</script>
三、正則表達(dá)式模式修飾符==(126)==
JavaScript中共有3種模式修飾符:g i u
四、正則表達(dá)式方法詳解==(127)==
經(jīng)常用到的正則表達(dá)式方法有兩個(gè)test() 和 exec()
4.1 test()方法
test(字符串)
在只想知道目標(biāo)字符串與某個(gè)模式是否匹配,但不需要知道其文本內(nèi)容的情況下,使用這個(gè)方法非常方便。因此, test() 方法經(jīng)常被用在 if 語(yǔ)句中。
<script type="text/javascript"> var pa = /girl/gi; if(pa.test("厲害了我的girl")){ alert("這個(gè)女孩和你很配"); }else { alert("你注定沒有女孩去匹配"); }</script>
4.2 exec()方法
exec(字符串):該方法為專門為捕獲組而設(shè)計(jì)的
<script type="text/javascript"> var pa = /girl/gi; var testStr = "myGirl, yourgirl, hisgIrl"; var girls = pa.exec(testStr); //捕獲 alert(girls.length + ":" + (girls instanceof Array)); //正則表達(dá)式?jīng)]有捕獲組,所以數(shù)組長(zhǎng)度為1 alert(girls[0]); //第一次捕獲的是 Girl //因?yàn)槲覀兪怯玫娜制ヅ洌源舜纹ヅ涞臅r(shí)候從上次匹后的位置開始繼續(xù)匹配 alert(pa.exec(testStr)[0]); // girl alert(pa.exec(testStr)); // gIrl alert(pa.exec(testStr)); //繼續(xù)向后沒有匹配的字符串,所以返回null // 返回null,如果繼續(xù)再匹配,則會(huì)回到字符串的開始,重寫開始匹配。 alert(pa.exec(testStr)); // Girl // ...開啟新一輪匹配</script>
所以我們?nèi)绻胝业饺科ヅ涞淖址梢詴r(shí)候用循環(huán),結(jié)束條件就是匹配結(jié)果為null
<script type="text/javascript"> var pa = /girl/gi; var testStr = "myGirl, yourgirl, hisgIrl"; var girls; while(girls = pa.exec(testStr)){ //如果等于null,會(huì)自動(dòng)轉(zhuǎn)成 false,結(jié)束。 alert(girls); }</script>
分組。在正則表達(dá)式中用()括起來任務(wù)是一組。組可以嵌套。
<script type="text/javascript"> //()內(nèi)的內(nèi)容就是第1組(Girl),其實(shí)我們完整真?zhèn)€表達(dá)式可以看出第0組 girl(Girl) // 將來對(duì)應(yīng)著匹配結(jié)果數(shù)組的下標(biāo)。 var pa = /girl(Girl)/gi; var test = "girlGirl abdfjla Girlgirl fal girl"; var girls; while(girls = pa.exec(test)){ //匹配之后,數(shù)組的第0個(gè)元素對(duì)應(yīng)的這第0組的匹配結(jié)果,第1個(gè)元素對(duì)應(yīng)著第1組的匹配結(jié)果 for (var i = 0; i < girls.length; i++) { console.log(girls[i]); } console.log("-------------"); }</script>//最終運(yùn)行結(jié)果:girlGirlGirl-------------Girlgirlgirl------------
五、正則表達(dá)式規(guī)則==(124)==
表達(dá)式規(guī)則
正則表達(dá)式元字符是包含特殊含義的字符。它們有一些特殊功能,可以控制匹配模式的
方式。反斜杠后的元字符將失去其特殊含義。
字符類:?jiǎn)蝹€(gè)字符和數(shù)字
[0-9A-Za-z]
元字符/元符號(hào) 匹配情況
. 匹配除換行符外的任意字符
[a-z0-9] 匹配括號(hào)中的字符集中的任意字符
[^a-z0-9] 匹配任意不在括號(hào)中的字符集中的字符
/d ==[0-9] 匹配數(shù)字
/D ==[^0-9] 匹配非數(shù)字,同[^0-9]相同
/w [0-9A-Za-z_] 匹配字母和數(shù)字及_
/W 匹配非(字母和數(shù)字及_)
字符類:空白字符
元字符/元符號(hào) 匹配情況
/0 匹配null 字符
/b 匹配空格字符
/n 匹配換行符
/r 匹配回車字符
/t 匹配制表符
/s 匹配空白字符、空格、制表符和換行符
/S 匹配非空白字符
字符類:錨字符
元字符/元符號(hào) 匹配情況
^ 行首匹配
$ 行尾匹配
字符類:重復(fù)字符
元字符/元符號(hào) 匹配情況
? 例如(x?) 匹配0個(gè)或1 個(gè)x
* 例如(x*) 匹配0個(gè)或任意多個(gè)x
+ 例如(x+) 匹配至少一個(gè)x
(xyz)+ 匹配至少一個(gè)(xyz)
{m,n} 例如x{m,n} n>=次數(shù)>=m 匹配最少m個(gè)、最多n個(gè)x
{n} 匹配前一項(xiàng)n次
{n,} 匹配前一項(xiàng)n次,或者多次
六、常用正則表示==(128)==
1、檢查郵政編碼
var pattern = /[1-9][0-9]{5}/; //共6位數(shù)字,第一位不能為0var str = '224000';alert(pattern.test(str));
2、檢查文件壓縮包
var pattern = /[/w]+/.zip|rar|gz/; ///w 表示所有數(shù)字和字母加下劃線var str = '123.zip'; ///.表示匹配.,后面是一個(gè)選擇alert(pattern.test(str));
3、刪除多余空格
var pattern = //s/g; //g 必須全局,才能全部匹配var reg=new RegExp('//s+','g');var str = '111 222 333';var result = str.replace(pattern,''); //把空格匹配成無空格alert(result);
4、刪除空格
var pattern = /^/s+/; var str = ' goo gle ';alert(str+" "+str.length);var result = str.replace(pattern, '');alert(result+" "+result.length);pattern = //s+$/; result = result.replace(pattern, '');alert(result+" "+result.length);pattern = //s+/g; result = result.replace(pattern, '');alert(result+" "+result.length);5、簡(jiǎn)單的電子郵件驗(yàn)證var pattern = /^([a-zA-Z0-9_/./-]+)@([a-zA-Z0-9_/./-]+)/.([a-zA-Z]{2,4})$/;var str = '[email protected]';alert(pattern.test(str));var pattern = /^([/w/./-]+)@([/w/./-]+)/.([/w]{2,4})$/;var str = '[email protected]';alert(pattern.test(str));
七、支持正則表達(dá)式的字符串方法
方法 | 描述 |
---|---|
search | 檢索與正則表達(dá)式相匹配的第一個(gè)匹配項(xiàng)的索引。 |
match | 找到一個(gè)或多個(gè)正則表達(dá)式的匹配。 |
replace | 替換與正則表達(dá)式匹配的子串。 |
split | 把字符串分割為字符串?dāng)?shù)組。 |
<script type="text/javascript"> var s = "Abc123aBc"; alert(s.search(/abc/gi)); alert(s.search(/abc/gi)); // 即使設(shè)置的全局模式,每次search也是從開始向后查找 //match方法和正則表達(dá)式的exec()方法的作用是一樣的,但是match會(huì)一次性把所有的匹配放在一個(gè)數(shù)組中,全部返回 alert(s.match(/abc/gi)); // Abc,aBc alert(s.replace(/[ab]/gi, "x")); //把a(bǔ)或b替換成x var ss = s.split(/[0-9]+/gi); //用1個(gè)或多個(gè)數(shù)字切割。 Abc,aBc alert(ss);</script>
以上所述是小編給大家介紹的JS基礎(chǔ)系列之正則表達(dá)式,希望對(duì)大家有所幫助,如果大家有任何疑問請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)VEVB武林網(wǎng)網(wǎng)站的支持!
新聞熱點(diǎn)
疑難解答
圖片精選