在js中,正則表達(dá)式是由一個RegExp對象表示的，RegExp 是正則表達(dá)式的縮寫。RegExp簡單的模式可以是一個單獨的字符。更復(fù)雜的模式包括了更多的字符，并可用于解析、格式檢查、替換等等。可以使用一個RegExp()構(gòu)造函數(shù)來創(chuàng)建RegExp對象，也可以使用直接量語法。

1、RegExp簡介。

　　RegExp即正則表達(dá)式（Regular Expression，在代碼中常簡寫為regex、regexp或RE/re/reg），就是使用單個字符串來描述、匹配一系列符合某個句法規(guī)則的字符串搜索模式，搜索模式可用于文本搜索和文本替換。

　　正則表達(dá)式是由一個字符序列形成的搜索模式，當(dāng)你在文本中搜索數(shù)據(jù)是，你可以用搜索模式來描述你要查詢的內(nèi)容，也就是說正則表達(dá)式是描述字符模式的對象，可用于對字符串模式匹配及檢索替換，是對字符串執(zhí)行模式匹配的強大工具。

　　所謂正則表達(dá)式，直接可理解為規(guī)則或者模式表達(dá)式，就是表達(dá)了某一種計算機可以理解的規(guī)則，而一般人很難讀懂的文字表達(dá)方式，可用于所有文本搜索和文本替換的操作，簡單說就是處理字符串。

2、字符串方法。

　　(1)、charAt()　　獲取某個字符，返回字符串某一位的字符。

　　(2)、split()　　分割字符串，獲得數(shù)組。

　　(3)、search()　　查找某個字符首次出現(xiàn)的位置，配合正則使用更好，返回值為數(shù)值，沒找到返回-1。

　　(4)、match()　　查找字符串中指定字符并返回該字符，如果不使用正則，則只返回首次出現(xiàn)的指定字符，不會再向后匹配，如果使用正則并進(jìn)行全局匹配，則以數(shù)組形式返回字符串中所有指定的字符，沒找到則返回null。

　　(5)、replace()　　替換字符，返回一個新字符串，配合正則使用更好，可以替換所有匹配。

 <script>
 var str='abcdefgca';
 //返回字符串中某一位的字符。
 alert(str.charAt());  //返回：d
 //查找字符串首次出現(xiàn)的位置。
 alert(str.search('z'));  //返回：-
 //查找指定的字符。
 //只返回第一次出現(xiàn)的c，不再向后匹配。
 alert(str.match('c'));  //返回：c
 //將'a'替換為'i'。
 //只替換了第一個位置的a，不再向后匹配。
 alert(str.replace('a', 'i'));  //返回：ibcdefgca
 //分割字符串。
 var str='--aaa--cd';
 var arr=str.split('-');  //返回：,,aaa,,cd
 alert(arr);
 </script>

實例：使用普通方法找出字符串中所有數(shù)字

實現(xiàn)思路：要找出字符串中的數(shù)字，其實也不難，使用判斷先將字符串中的數(shù)字提取出來，那么字符串中肯定不止一個數(shù)字，所以就需要一個空字符串來存儲提取出來的數(shù)字字符，然后再將這些數(shù)字字符添加到數(shù)組中，最后返回，這樣就完成了。來看看程序是怎么實現(xiàn)的：

 <script>
 var str=' abc d aa c zz -=-=s-';
 var arr=[];
 var num='';
 //首先循環(huán)遍歷字符串
 for(var i=;i<str.length;i++){
   //再判斷當(dāng)前字符大于等于并且小于等于，則為數(shù)字
   if(str.charAt(i)>='' && str.charAt(i)<=''){
     //那么就將當(dāng)前的字符存儲在空字符串中
    num += str.charAt(i);
   }
   else{
     //如果字符串中有值。
     if(num){
       //將值添加到數(shù)組中。
       arr.push(num);
       //再清空字符串，避免重復(fù)添加。
       num='';
     }
   }
 }
 //最后在整個字符串結(jié)束之后有可能還會有數(shù)字，再做一次判斷。
 if(num){
   //如果還有值就添加到數(shù)組中。
   arr.push(num);
   //再清空字符串。
   num='';
 }
 //返回：OK，現(xiàn)在返回就完成了。
 alert(arr);　//返回：,,,,,,,
 </script>

雖然可以使用普通方法完成，結(jié)構(gòu)清晰，但是代碼相對較長，如果使用正則，那么一個表達(dá)式就完成了這么多工作，非常方便，下面就來看看怎么使用正則。

3、使用正則。

　　正則表達(dá)式語法：var re = new RegExp('模式', '修飾符');

　　模式就是表達(dá)式的模式，而修飾符是用于指定全局匹配、不區(qū)分大小寫等，完整形態(tài)就是正則表達(dá)式。

　　看到正則語法長這模樣，不就是JS中典型的新創(chuàng)建對象的語法么，對了，就是新創(chuàng)建一個正則對象。我們都知道，要盡量避免使用new關(guān)鍵詞，使用new無疑就是新創(chuàng)建了一個對象，那么同時就預(yù)示著其占據(jù)了一定的內(nèi)存空間，如果處理不當(dāng)，積累多了會造成內(nèi)存溢出，這樣相當(dāng)耗費資源，不利于代碼優(yōu)化的實現(xiàn)。同時這樣的寫法，體現(xiàn)不出正則的強大，他應(yīng)該是很簡a潔的才對，因此在實際使用的時候都不采用這種JS風(fēng)格的正則語法，都使用的是另一種風(fēng)格，如下：

　　語法：var re = /模式/修飾符;

　　這種風(fēng)格就相對簡潔了，屬于一般人看不懂的表達(dá)方式。

　　(1)、修飾符。

　　修飾符用于執(zhí)行全局匹配和區(qū)分大小寫。

　　忽略大小寫：i (ignore的簡寫，中文翻譯為：忽視)

　　全局匹配：g (global的簡寫，中文翻譯為：全部的/全局的)

　　實例：全局搜索指定字符

 <script>
 var str='AbCdEFgiX';
 //JS風(fēng)格：
 //這個正則表達(dá)式什么也不代表，只代表abc本身。
 var reg=new RegExp('abc', 'i');
 alert(str.match(reg));  //返回：AbC
 //常用風(fēng)格：
 var re=/efg/i;
 alert(str.match(re));  //返回：EFg
 </script>

4、方括號和元字符。

　　(1)、方括號。

　　方括號用于查找某個范圍內(nèi)的字符。
　?、?、任意字符
　　表達(dá)式：[abc]
　　查找方括號中的任意字符。
　　[]在這里為或的意思，即隨便出現(xiàn)哪個都行。

<script>
 var str='apc xpc ppc bpc spc opc';
 //[apx]pc，隨便出現(xiàn)哪個都行，即：apc ppc xpc
 var re=/[apx]pc/g;
 alert(str.match(re));  //返回前個pc。
 </script>

 　?、?、范圍查找。

　　表達(dá)式：[0-9] [a-z] [A-z] [A-Z]

　　[0-9]　　查找任意 0 - 9 的數(shù)字。

　　[a-z]　　查找任意 a - z 的字符。

　　[A-z]　　查找任意 大寫A - 小寫z 的字符。

　　[A-Z]　　查找任意 大寫A - 大寫Z的字符。

　?、?、排除查找。

　　表達(dá)式：[^abc] [^a-z] [^0-9]

　　[^abc]　　查找任意不在方括號中的字符。

　　[^a-z]　　查找任意除了字母以外的字符，包括數(shù)字符號中文外文。

　　[^0-9]　　查找任意除了數(shù)字以外的字符，包括字母符號中文外文。

 <script>
 var str='ot out o.t o t o`t ot ot';
 //o和t中間除了數(shù)字，什么都可以
 var re=/o[^-]t/g;
 alert(str.match(re));  //返回：out,o.t,o t,o`t
 </script>

　?、?、選擇查找。

　　表達(dá)式：(a|b|c)

　　查找任何指定的選項，a或b或c。

　?、荨⑵ヅ溥€可以使用組合模式，比如：[a-z0-9A-Z] [^a-z0-9]

　　[a-z0-9A-Z]　　任意大小寫字母和數(shù)字。

　　[^a-z0-9]　　除了字母和數(shù)字以外，什么都可以。

　　(2)、元字符。

　　元字符是擁有特殊含義的字符，也可以叫做轉(zhuǎn)義字符。

　　下面是一些常用的元字符：

5、量詞。

　　所謂量詞，就是數(shù)量詞，即個數(shù)，用在正則中，表示出現(xiàn)的次數(shù)。

　　下面是一些常用的量詞：

下面是一些常用的匹配模式：

6、字符串和正則配合。

 　　(1)、search()配合正則

　　實例：找出字符串中第一次出現(xiàn)數(shù)字的位置

 <script>
 var str='asdf  zxcvbnm';
 //元字符\d，表示轉(zhuǎn)義為數(shù)字
 var re=/\d/;
 alert(str.search(re));  //返回： 第一個數(shù)字為出現(xiàn)在第位
 </script>

 　　(2)、match()配合正則

　　其實沒有什么東西是非正則不可的，只是正則可以讓做東西更方便。下面就完成本章遺留的歷史問題，怎么使用正則，能一句代碼就完成普通方法需要很多行代碼才能完成的東西。

　　在實例之前，先看看match()與正則的配合。

<script>
 var str='asdf  zxcvm';
 //找出字符串中的數(shù)字可以使用元字符\d
 var re=/\d/;
 //沒告訴系統(tǒng)要找多少數(shù)字，系統(tǒng)在找到數(shù)字后就返回
 alert(str.match(re));  //返回：
 //因此需要全局匹配，使用修飾符g
 var re=/\d/g;
 //沒告訴系統(tǒng)要找?guī)孜?，系統(tǒng)會將所有找到的數(shù)字返回
 alert(str.match(re));  //返回：,,,,,,,,,,,,
 //所以可以使用兩個元字符，告訴系統(tǒng)要找的數(shù)字是位
 var re=/\d\d/g;
 //顯然這樣是不可取的，因為數(shù)字的位數(shù)并不固定，可能是位，有可能還是多位
 alert(str.match(re));  //返回：,,,,
 //所以需要用到量詞+，+代表若干,也就是多少都可以。
 var re=/\d+/g;
 //現(xiàn)在返回正確。
 alert(str.match(re));  //返回：,,,,
 </script>

 　　實例：使用正則找出字符串中所有數(shù)字

 <script>
 var str=' abc d aa c zz -=-=s-';
 //alert(str.match(/\d+/g));
 //元字符\d也可以使用[-]代替，到隨便哪個都行。
 alert(str.match(/[-]+/g));  //返回：,,,,,,,
 </script>

　　正則是強大的字符串匹配工具，就這樣簡單的使用一句代碼就完成了。

　　(3)、replace()配合正則

 <script>
 var str='abc zaaz deaxcaa';
 //將字符串中的a替換為數(shù)字
 alert(str.replace('a', ));  //僅僅只將第一個a替換為
 //配合正則使用匹配所有a再替換
 var re=/a/g;
 alert(str.replace(re, ''));  //返回所有的a都為
 </script>

 　　實例：簡單的敏感詞過濾

　　所謂的敏感詞，就是法律不允許的詞語，一切非法詞都可以叫做敏感詞，這包括的范圍就太廣了，比如危害國家安全，反對憲法確立的基本原則，散步謠言，擾亂民心，擾亂社會秩序，破壞社會穩(wěn)定，色情、暴力、賭博、虛假、侵害、騷擾、粗俗、猥褻或其他道德上令人反感的詞，以及含有法律規(guī)定或禁止的其他內(nèi)容的詞語。在平時最常見也是大多數(shù)人都會用的詞莫屬道德上令人反感的詞了，說斯文一點就是吵架時用于攻擊別人的詞語。這里就列舉幾個熱門的網(wǎng)絡(luò)詞語作為例子。

 <!DOCTYPE html>
 <html>
 <head>
   <meta charset="UTF-">
   <title>JavaScript實例</title>
 <script>
 window.onload=function (){
   var oBtn=document.getElementById('btn');
   var oTxt=document.getElementById('txt');
   var oTxt=document.getElementById('txt');
   oBtn.onclick=function (){
     //這里的|在正則中表示 或 的意思
     var re=/元芳|萌萌噠|然并卵|毛線|二貨|城會玩/g;
     //文本框的值等于文本框的值過濾掉敏感詞
     oTxt.value=oTxt.value.replace(re,'***');
   };
 };
 </script>
 </head>
 <body>
 <textarea id="txt" rows="" cols=""></textarea><br>
 <input id="btn" type="button" value="過濾"><br>
 <textarea id="txt" rows="" cols=""></textarea>
 </body>
 </html>

　　可在第一個文本框中輸入一些相關(guān)語句，點擊過濾按鈕，查看過濾后的效果。

　　此外，支持正則表達(dá)式的 String 對象的方法還包括 split() 方法，可把字符串分割為字符串?dāng)?shù)組。

7、RegExp對象方法。

　　在JS中，RegExp對象是一個預(yù)定義了屬性和方法的正則表達(dá)式對象。

　　(1)、test()

　　test() 方法用于檢測一個字符串是否匹配某個模式，也就是檢測指定字符串是否含有某個子串，如果字符串中含有匹配的文本，返回 true，否則返回 false。

　　語法：RegExpObject.test(str)

　　調(diào)用 RegExp 對象 re 的 test() 方法，并為它傳遞字符串str，與這個表示式是等價的：(re.exec(str) != null)。

　　實例：搜索字符串是否含有指定的字符

 <script>
 var str='The best things in life are free, like hugs, smiles, friends, kisses, family, love and good memories.';
 var re=/i/;
 alert(re.test(str));  //返回：true
 var reg=/z/;
 alert(reg.test(str));  //返回：false
 //上面的代碼可以不用定義正則的變量，直接使用，將兩行合并為一行。
 alert(/i/.test(str));
 alert(/z/.test(str));
 </script>

　　(2)、exec()

　　exec() 方法用于檢索字符串中的正則表達(dá)式的匹配，提取指定字符串中符合要求的子串，該方法返回一個數(shù)組，其中存放匹配的結(jié)果。如果未找到匹配，則返回 null?？梢允褂醚h(huán)提取所有或者指定index的數(shù)據(jù)。

　　語法：RegExpObject.exec(str)

　　exec() 方法的功能非常強大，它是一個通用的方法，可以說是test() 方法的升級版，因為他不僅可以檢測，而且檢測到了可以直接提取結(jié)果。該方法使用起來比 test() 方法以及支持正則表達(dá)式的 String 對象的方法更為復(fù)雜。

 <script>
 var str = 'good good study day day up';
 var re = /good/;
 var arr = re.exec(str);
 console.log(arr);　　//控制臺顯示：["good"]點開后顯示： "good"，index ，input "good good study day day up"。
 console.log(arr.index);　　//控制臺顯示：
 console.log(arr.input);　　//控制臺顯示：good good study day day up
 </script>

　　通過上面的實例，可以看到，如果 exec() 找到了匹配的文本，則返回一個結(jié)果數(shù)組。否則，返回 null。此數(shù)組的第 0 個元素是與正則表達(dá)式相匹配的文本，第 1 個元素是與 RegExpObject 的第 1 個子表達(dá)式相匹配的文本（如果有的話），第 2 個元素是與 RegExpObject 的第 2 個子表達(dá)式相匹配的文本（如果有的話），以此類推。

　　除了數(shù)組元素和 length 屬性之外，exec() 方法還返回兩個屬性。index 屬性聲明的是匹配文本的第一個字符的位置。input 屬性則存放的是被檢索的字符串 string。我們可以看出，在調(diào)用非全局的 RegExp 對象的 exec() 方法時，返回的數(shù)組與調(diào)用方法 String.match() 返回的數(shù)組是相同的?！?/p>

　　什么是"與子表達(dá)式相匹配的文本"？

　　所謂的子表達(dá)式就是正則表達(dá)式中包含在圓括號中的內(nèi)容?？聪旅鎸嵗?/p>

 <script>
 var str = 'good good study day day up';
 var re = /g(o+)d/;
 var arr = re.exec(str);
 console.log(arr);  //顯示：["good", "oo"]點開后顯示： "good", "oo", index ，input: "good good study day day up"
 console.log(arr.length); //顯示：
 var reg = /(o+)/;
 //var reg = /o+/;  只返回一個"oo"，長度為
 var arr = reg.exec(str);
 console.log(arr);  //顯示：["oo", "oo"]點開后顯示： "oo", "oo", index ，input: "good good study day day up"
 console.log(arr.length); //顯示：
 </script>

 　　通過上例，可以看到，子表達(dá)式是一個大的表達(dá)式的一部分，并且必須用()包含起來。一個表達(dá)式可使用多個子表達(dá)式，同時還支持多層嵌套，把一個表達(dá)式劃分為多個子表達(dá)式的目的是為了把那些子表達(dá)式當(dāng)作一個獨立的元素來使用。也就是說表達(dá)式中的子表達(dá)式可以作為整個表達(dá)式返回，也可以作為一個單獨的表達(dá)式返回。所以上面的數(shù)組長度為 2。

　　使用子表達(dá)式是為了提取匹配的子字符串，表達(dá)式中有幾個()就有幾個相應(yīng)的匹配字符串，順序會依照()出現(xiàn)的順序依次進(jìn)行，并且()中可以使用 或"|" 進(jìn)行多個選擇。也就是說可以使用()對字符進(jìn)行分組，并保存匹配的文本。

　　如果該方法使用全局匹配，則找到第一個指定字符，并存儲其位置，如果再次運行 exec()，則從存儲的位置（lastIndex）開始檢索，并找到下一個指定字符，存儲其位置。lastIndex屬性是RegExp對象屬性，是一個整數(shù)，標(biāo)示開始下一次匹配的字符位置?？聪旅鎸嵗?/p>

 <script>
 var str = 'good good study day day up';
 var re = /good/g;
 var arr;
 do{
   arr = re.exec(str);
   console.log(arr);
   console.log(re.lastIndex);
 }
 while(arr !== null)
 /*
 結(jié)果如下：
 顯示：["good"]，點開后： "good", index , input "good good study day day up"。
 lastIndex為。
 顯示：["good"]，點開后： "good", index , input "good good study day day up"。
 lastIndex為。
 
 顯示：null 
 lastIndex為。
 */
 </script>

 　　在調(diào)用非全局的 RegExp 對象的 exec() 方法時，返回的數(shù)組與調(diào)用 String.match() 返回的數(shù)組是相同的。但是，當(dāng) RegExpObject 是一個全局正則表達(dá)式時，exec() 的行為就稍微復(fù)雜一些。它會在 RegExpObject 的 lastIndex 屬性指定的字符處開始檢索字符串 string。當(dāng) exec() 找到了與表達(dá)式相匹配的文本時，在匹配后，它將把 RegExpObject 的 lastIndex 屬性設(shè)置為匹配文本的最后一個字符的下一個位置。這就是說，可以通過反復(fù)調(diào)用 exec() 方法來遍歷字符串中的所有匹配文本。當(dāng) exec() 再也找不到匹配的文本時，它將返回 null，并把 lastIndex 屬性重置為 0。

　　通過上面實例，可以看到，當(dāng)?shù)谌窝h(huán)時，找不到指定的 "good"，于是返回null，lastIndex值也變成0了。找到的第一個"good"的lastIndex值為4，是匹配文本最后一個字符的下一個位置。

<script>
 var str = 'good good study day day up';
 var re = /good/g;
 var arr;
 while((arr = re.exec(str)) != null){
   console.log(arr);
   console.log(re.lastIndex);
 }
 /*
 結(jié)果如下：
 顯示：["good"]，點開后： "good", index , input "good good study day day up"。
 lastIndex為。
 
 顯示：["good"]，點開后： "good", index , input "good good study day day up"。
 lastIndex為。
 */
 </script>

　　這里需要注意，如果在一個字符串中完成了一次模式匹配之后要開始檢索新的字符串(仍然使用舊的re)，就必須手動地把 lastIndex 屬性重置為 0。

　　無論 RegExpObject 是否是全局模式，exec() 都會把完整的細(xì)節(jié)添加到它返回的數(shù)組中。這就是 exec() 與 String.match() 的不同之處，后者在全局模式下返回的信息要少得多。因此可以這么認(rèn)為，在循環(huán)中反復(fù)地調(diào)用 exec() 方法是唯一一種獲得全局模式的完整模式匹配信息的方法。

　　(3)、compile

　　compile() 方法用于在腳本執(zhí)行過程中編譯正則表達(dá)式，也可用于改變和重新編譯正則表達(dá)式。主要作用是改變當(dāng)前(re)匹配模式。

　　語法：RegExpObject.compile(模式, 修飾符)

　　模式就是正則表達(dá)式，修飾符用于規(guī)定匹配的類型，g匹配全局，i忽略大小寫，gi全局匹配忽略大小寫。

　　該方法是改變匹配模式時使用的，一般情況下，能用到的地方很少。

　　實例：在全局中忽略大小寫 搜索"day"，并用 "天" 替換，然后通過compile()方法，改變正則表達(dá)式，用 "日" 替換 "Today" 或 "day"。

 <script>
 var str = 'Today is a beautiful day, Day day happy！';
 var re = /day/gi;
 var str = str.replace(re, '天');
 console.log(str);  //輸出：To天 is a beautiful 天, 天 天 happy！
 reg = /(to)?day/gi;
 reg.compile(reg); 
 str = str.replace(reg, '日');
 console.log(str);  //輸出：日 is a beautiful 日, 日 日 happy！
 </script>

8、正則應(yīng)用。

　　正則表達(dá)式也叫規(guī)則表達(dá)式，所以在編寫時，和編寫JS的流程一樣，先慮再寫。最重要的就是，要搞清楚他所要表達(dá)的規(guī)則，先仔細(xì)端詳其外表，看他到底長的什么模樣，也就是以什么樣的格式存在，再根據(jù)這種格式去寫表達(dá)式，看是否能達(dá)到我們預(yù)期的目的，如果未達(dá)到，其實一般情況下直接將格式描述成表達(dá)式，都不會達(dá)到預(yù)期的效果，好在我們的主框架已經(jīng)有了，我們只需要知道是什么地方出錯了，什么地方?jīng)]有達(dá)到預(yù)期，就可以很簡單的在這個框架基礎(chǔ)上稍加修改，最后就是完美的表達(dá)式了。比如要寫一個驗證手機號的正則表達(dá)式，手機號大家都知道是11位，全部為數(shù)字，而且開頭是1，緊跟著的2位，因為運營商不同，可有多種組合，后面8位是任意數(shù)字，所以我們就可以規(guī)定開頭必須為1，后面2位根據(jù)各運營商提供的不同組合進(jìn)行限定，最后再輸入8位任意數(shù)字。這樣主框架就算完成了，但是手機號也有特殊情況，比如移動給手機號碼前邊加上+86依然可以使用，必要的時候我們還需要把這種情況考慮進(jìn)去，不然用戶輸入了自己的移動手機號給前邊加了個+86，然后點擊提及，系統(tǒng) "啪" 彈出一個窗口，你輸入的是毛線，系統(tǒng)不識別，這樣就鬧笑話了，所以再只需要對框架做出修改，把這種情況考慮進(jìn)去，就大功告成了。

　　這么說起來正則表達(dá)式貌似很簡單的樣子，其實挺難的，why are you so diao？歸根結(jié)底就是這種一般人很難看懂的表達(dá)方式，自己當(dāng)時寫的時候很明白表達(dá)的是什么，過段時間回頭，哎喲我去，怎么不認(rèn)識了。其實這是一個熟能生巧的過程，記得有篇課文中寫到“好記性不如爛筆頭”，勤能補拙，多動手多寫多思考，通過碼海戰(zhàn)術(shù)，反復(fù)推敲代碼，讓自己身經(jīng)百戰(zhàn)，見的多了，自然就不虛了，編程是一門藝術(shù)，精通任何一門藝術(shù)，都需要大量的練習(xí)和領(lǐng)悟，知識就是一個積累的過程，當(dāng)然更重要的還是要自己去總結(jié)歸納，讓知識真正屬于自己。我覺著寫程序這東西吧，最重要的還是思維，讓代碼始終跟著這種思維走，目的只有一個，怎么簡單怎么省事怎么做，當(dāng)然不是偷工減料，要明白需要什么，不需要什么，要呈現(xiàn)出什么樣的效果，應(yīng)該怎么去一步步實現(xiàn)，只要有這種實現(xiàn)目的的思維，就可以讓代碼始終保持著清晰簡潔的狀態(tài)，加快編寫代碼的效率，還有助于排錯，也有利于代碼的優(yōu)化。那個好像扯太遠(yuǎn)了，每個人都有自己思考問題的方式，有不同的做事風(fēng)格，只要最優(yōu)化解決問題就好了，回到正事，接下來看看正則表達(dá)式應(yīng)用的兩個實例。

　　(1)、正則驗證QQ號。

　　思路分析：QQ號有一個特性全部為數(shù)字，而且第一位不為0，那么就可以這樣寫/^[1-9]/，開頭為1-9隨便哪個數(shù)字，常見的QQ號最少的是5位數(shù)，最多的是10位數(shù)，那么可以使用量詞{n,m}限定位數(shù)，表達(dá)式為/\d{5,10}/，這有一個小問題，前邊我們已經(jīng)限定了開頭的第一位，那就說明還可以再輸入至少4位，最多9位的數(shù)字，這樣才匹配了最少5位最多10位，將表達(dá)式改為/\d{4,9}/，最后再限定結(jié)尾不能是非數(shù)字，就完事了。下面看代碼是怎么完成的：

<!DOCTYPE html>
 <html>
 <head>
   <meta charset="UTF-">
   <title>JavaScript實例</title>
 <script>
 window.onload = function (){
   var oBtn = document.getElementById('btn');
   oBtn.onclick = function (){
     var oTxt = document.getElementById('txt').value;
     var re=/^[-]\d{,}$/;
     //用定義的正則表達(dá)式檢測輸入框的值是否匹配。
     if(re.test(oTxt)){  
       alert("格式正確");
     }
     else{
       alert('輸入錯誤');
     }
   };
 };
 </script>
 </head>
 <body>
 <input id="txt" type="text" placeholder="請輸入QQ">
 <input id="btn" type="button" value="驗證">
 </body>
 </html>

　　(2)、正則驗證郵箱。

　　思路分析：先端詳下郵箱的外表，隨便來個abc123_@ss789.xyz，郵箱是典型的粗俗的分析下其結(jié)構(gòu)組成，大致可分為五部分，第一部分若干字母、若干數(shù)字還有一個下劃線，第二部分是一個@，第三部分又是若干字母、若干數(shù)字，第四部分是一個點，最后一部分又是若干字母，誒、郵箱長的好復(fù)雜，各種若干?，F(xiàn)在我們看光了郵箱的模樣，清楚了郵箱的規(guī)則，就可以使用表達(dá)式描述了，第一部分可寫為/\w+/，表示若干英文，第二部分就采用@，第三部分可表達(dá)為[a-z0-9]+，若干字母數(shù)字都可以，第四部分需要注意，點在正則中代表任意字符，如果想直接顯示為點，就需要使用轉(zhuǎn)義，就寫為\.，最后一部分若干英文，表達(dá)為[a-z]+，這樣就用正則的規(guī)則把郵箱的規(guī)則描述完了，最后再使用忽略大小寫，將格式整理下：/\w+@[a-z0-9]+\.[a-z]+/　　下面就用我們分析的表達(dá)式直接驗證一下：

 <!DOCTYPE html>
 <html>
 <head>
   <meta charset="UTF-">
   <title>JavaScript實例</title>
 <script>
 window.onload=function (){
   var oBtn=document.getElementById('btn');
   var oTxt=document.getElementById('txt');
   oBtn.onclick=function (){
     var re=/\w+@[a-z-]+\.[a-z]+/i;
     if(re.test(oTxt.value)){
       alert('合法郵箱');
     }
     else{
       alert('非法郵箱');
     }
   };
 };
 </script>
 </head>
 <body>
 <input id="txt" type="text" placeholder="請輸入郵箱">
 <input id="btn" type="button" value="驗證">
 </body>
 </html>

　　將我們上面用于分析的郵箱例子abc123_@ss789.xyz拿來檢測，OK，合法郵箱，這就沒問題了嗎？我們再來驗證下這個郵箱：正則abc123_@ss789.xyz校驗，OK，還是合法郵箱，這郵箱看著都不正規(guī)，跟我們之前分析的郵箱樣子，長的從本質(zhì)上都不一樣，正則怎么會判斷合法呢？這不是我們要的效果，顯然是我們的表達(dá)式有點小問題，就像之前說的，一般情況下直接將格式描述成表達(dá)式，都不會達(dá)到預(yù)期的效果，那怎么解決呢？先開分析下是什么原因?qū)е碌?，其實因為正則對象方法test()造成的，該方法有一個特性：只要這個字符串其中的一部分符合要求，就返回true。解決方法其實也很簡單，讓整個字符串都被正則檢測，而不只是檢測一部分，所以再加上行首行尾就OK了。其實熟練了正則之后，像這樣的小問題，一般也不可能出現(xiàn)，這里的注重點是思路，要養(yǎng)成一種編寫代碼的思維模式。

 <!DOCTYPE html>
 <html>
 <head>
 <meta charset="UTF-">
 <title>JavaScript實例</title>
 <script>
 window.onload=function (){
   var oBtn=document.getElementById('btn');
   var oTxt=document.getElementById('txt');
   oBtn.onclick=function (){
     var re=/^\w+@[a-z-]+\.[a-z]+$/i;
     if(re.test(oTxt.value)){
       alert('合法郵箱');
     }
     else{
       alert('非法郵箱');
     }
   };
 };
 </script>
 </head>
 <body>
 <input id="txt" type="text" placeholder="請輸入郵箱">
 <input id="btn" type="button" value="驗證">
 </body>
 </html>

現(xiàn)在對剛才的2個郵箱再次驗證，第一個合法，第二個非法，這個正則驗證郵箱的表達(dá)式就沒問題了。其實還是不夠嚴(yán)謹(jǐn)，現(xiàn)在網(wǎng)站大多要填郵箱的地方，郵箱的服務(wù)器地址也就是后綴名如@qq.com等都提供了下拉列表，可供用戶選擇，如果是需要整個郵箱都自行輸入，那么這個正則表達(dá)式問題就來了，郵箱的后綴名可以分為幾類，其第三部分和最后一部分都是固定的格式，如果使用該表達(dá)式驗證，那事就大了，因為我們給每一部分定義的都是可輸入若干，很顯然這是非法的格式，郵箱的后綴是需要做限定的，這里只是簡單的做一個實現(xiàn)思路的分析，在真正用的時候，還需要具體問題具體對待。像這種需要驗證的東西，前端不可能做到完美，前端就算寫的再嚴(yán)謹(jǐn)，也是很容易出問題的，所以這是屬于后端干的事，但是前端可以對用戶的輸入做一個簡單的格式驗證，只有確保用戶輸入正確了，再配合后端，那就是事半功倍的。

PS:RegExp幾個常用方法說明

1、Test()

RegExpObject.test(string)

判斷string中是否有與表達(dá)式匹配的字符串，有則返回true,否則返回false
例如
var patt1=new RegExp("e");   
document.write(patt1.test("The best things in life are free"));  
由于該字符串中存在字母 "e"，以上代碼的輸出將是：true

2、exec()

RegExpObject.exec(string)
exec() 方法檢索字符串中的指定值。返回值是被找到的值。如果沒有發(fā)現(xiàn)匹配，則返回 null。

例如

JScript 代碼 

var str= "cat2,hat8" ;
var reg=/c(at)\\d/ ; 有分組
console.info(reg.exec(str));//運行返回  ["cat2", "at"]

3、Match()

string.match(RegExpObject)
它和exec有類似，也是返回一個數(shù)組，但它們有區(qū)別。
區(qū)別1：如下如果正則中有g(shù)，則match返回所有匹配。而exec永遠(yuǎn)只返回與第一個匹配有關(guān)的信息。
區(qū)別2：如果沒有g(shù)，但是有分組，則兩個結(jié)果一樣?；蛘邲]有g(shù)也沒有分組。只返回第一個匹配。

實例

JScript 代碼

var someText= "web2.0 .net2.0" ;
var pattern=/(\\w+)(\\d)\\.(\\d)/g;
var outCome_exec=pattern.exec(someText); ["web2.0","web","2","0"]
var outCome_matc=someText.match(pattern); ["web2.0","net2.0"]

4、Search()

stringObject.search(regexp)

返回第一個匹配的起始位置。

5、Replace()

stringObject.replace(regexp/substr,replacement)

返回新替換過后的新字符串。
如果是字符串，替換第一個。如果是正則表達(dá)式中有g(shù)，則全部替換，否則也是一個。

例如

JScript 代碼

function fn() { 
for(var i = 0;i < arguments.length;i++){
alert("第"+(i+1)+"個參數(shù)的值："+arguments[i]);
} 
} 
var str = '<div id="{wo}" >{ni}</div>'; 
str.replace(/\\{([a-z]+)\\}/ig, fn); 

 6、Split()

stringObject.split(separator,howmany)

第一個參數(shù)是字符串或者正則表達(dá)式，從它開始分解字符串。第二個參數(shù)表示返回數(shù)組的最大長度。

例如 

JScript 代碼 

var str= "cat2,hat8" ;
var reg=/at/ ;
console.info(str.split(reg));
["c", "2,h", "8"]
console.info(str.split(reg，2));
["c", "2,h"]

7、compile()

compile() 方法用于改變 RegExp。
compile() 既可以改變檢索模式，也可以添加或刪除第二個參數(shù)。

例如 

JScript 代碼

var patt1=new RegExp("e");  
document.write(patt1.test("The best things in life are free"));  
patt1.compile("d");  
document.write(patt1.test("The best things in life are free")); 

8、關(guān)于$0~$99的例子

JScript 代碼

var str="alert.login.verifyfailed=Your email or password is incorrect!";
var reg=/^alert.\\w*(.\\w*)=((?:\\w*[ !\\.])*)$/;
var out=str.match(reg);
console.info($0);

9、測試RegExp屬性

JScript 代碼 

function demo(){
  var str = "abcdd abcsszabcdddccabAbcddABCEE";
  var regex = /a(bc)/gi;
  var t = null;
  while(t = regex.exec(str)){
    var result = "index = " + t.index + ", match = " + t[0] + ", group = " + t[1];
    result += "/n$1=" + RegExp.$1 + ", lastMatch=" + RegExp.lastMatch + ", leftContext=" + RegExp.leftContext;
    alert(result);
  }
}

最新評論