DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> JavaScript基礎知識 >> JavaScript 學習筆記(十四) 正則表達式
JavaScript 學習筆記(十四) 正則表達式
編輯:JavaScript基礎知識     

RegExp類
RegExp對象的構造函數可以帶一個或兩個參數
第一個參數是描述需要進行匹配的模式字符串,如果還有第二個參數,這個參數則制定了額外的處理指令。
一、基礎
1.1使用RegExp對象
test()方法
測試是否匹配。如果給定字符串(只有一個參數)匹配這個模式,它就返回true,否則返回false
復制代碼 代碼如下:
var sToMatch = "cat";
var reCat = /cat/; //正則表達式字面量使用Perl風格的語法
alert(reCat.test(sToMatch)); //outs "true"

exec()方法
有一個字符串參數,返回一個數組。數組中的第一個條目是第一個匹配,其他的是反向引用。(即數組中只有一個,並且是第一個匹配的)
復制代碼 代碼如下:
var strAAA = "a bat, a Cat, a fAt baT, a faT cat";
var regAt = new RegExp("at", "gi");
var arr = regAt.exec(strAAA); //arr[0]為"at",arr.index值為3,arr.lastIndex值為5
match()方法

返回一個包含在字符串中的所有匹配的數組。
var strAAA = "a bat, a Cat, a fAt baT, a faT cat";
var regAt = new RegExp("at", "gi");
var arrMatch = strAAA.match(regAt); //注意:字符串.match(參數是匹配字符)跟上面相反
search()方法
與indexOf()有些類似,返回在字符串中出現的一個匹配的位置。它的參數是一個RegExp對象而非僅僅一個子字符串。
復制代碼 代碼如下:
var strAAA = "a bat, a Cat, a fAt baT, a faT cat";
var regAt = new RegExp("at", "gi");
var index = strAAA.search(regAt); //outputs "3" 第一次出現位置是3

1.2擴展字符串方法
replace()方法
可以用第二個參數替換第一個參數,而在這裡第一個參數也可以是一個正則表達式。
var strBBB = "The Sky is red.";
//將上面這句話中的所有s替換,用正則表達式找出所有匹配的
var strNewBBB = strBBB.replace(/s/gi, "##"); //把所有的“s”(不管大小寫)都替換成##
再進行升級一下,第二個參數也可以是一個函數
復制代碼 代碼如下:
var sToChange = "The sky is red.";
var reRed = /red/;
var sResultText = sToChange.replace(reRed, function(sMatch) {
return "blue";
});
alert(sResultText);

在這個例子中,在函數中的sMatch的值總為"red" (因為這是唯一匹配的模式)."red"的首次出現被替換為函數的返回值"blue".
附加:
對於書上這句話“因為這是唯一匹配的模式”我認為應該是這個意思吧,replace只有兩個參數,第一個參數找出來的是唯一的,那個function的參數sMatch應該就是前面的第一個參數的值,唯一匹配模式。。。
split()方法
復制代碼 代碼如下:
var sColor = "red,blue,yellow,green";
var reComma = /\,/;
var arrColors = sColor.split(reComma); //split at each comma
alert(arrColors.length); //outputs "4"

正則表達式reComma中必須在逗號前有一個反斜槓,因為逗號在語法中有特殊含義,必須經過轉義。
二、簡單模式
2.1元字符
正則表達式用到的所有元字符有:
( [ { \ ^ $ | ) ? * + .
一共12個。在任何時候要用到這些元字符的時候就需要轉義,也就是在前面加上反斜槓。
例:
var reQMark = /\?/; //轉義
var reQMark=new RegExp("\\?"); //這裡需要注意,雙重轉義,因為本身反斜槓也是需要轉義
所以我們以後應該盡量使用第一種情況,字面量語法!Perl的風格
2.2使用特殊字符
另外,還有其他一些預定義的特殊字符,如下表所列:
字符 描述
----------------------------------------------------
\t 制表符
\n 換行符
\r 回車符
\f 換頁符
\a alert字符
\e escape字符
\cX 與X相對應的控制字符
\b 回退字符
\v 垂直制表符
\0 空字符
----------------------------------------------------
2.3字符類
將一些字符放入方括號中,可以很有效的告訴正則表達式去匹配第一個、第二個、第三個字符等等。
//①字符類----簡單類
var sToMatch = "a bat,a Cat,a fAt baT,a faT cat";
//匹配以bat或cat或fat的正則表達式
var reBatCatFat = /[bcf]at/gi;
//var reBatCatRat=/[\u0062cf]at/gi; 使用Unicode形式
var arrMatches = sToMatch.match(reBatCatRat);
alert(arrMatches.join(",")); //輸出"bat,Cat,fAt,baT,faT,cat"
//②字符類----負向類
var sToMatch = "a bat,a Cat,a fAt baT,a faT cat";
//匹配以at結尾,但是不以b或c開頭的正則表達式
var reBatCatRat = /[^bc]at/gi; //脫字符^表示不能匹配後面跟著的字符
var arrMatches = sToMatch.match(reBatCatRat);
alert(arrMatches.join(",")); //輸出 "fAt,faT"
//③字符類----范圍類
//指定從a到z之間的范圍:[a-z]. 這裡是區分大小寫的
var sToMatch = "num1,num2,num3,num4,num5,num6,num7,num8,num9";
var reOneToFour = /num[1-4]/gi; //從1到4
var arrMatches = sToMatch.match(reOneToFour);
alert(arrMatches.join(",")); //輸出 "num1,num2,num3,num4"
//④字符類----組合類
組合類(combination class)是由幾種其他的類組合而成的字符類.
假如要匹配所有的從a-m的字母以及從1-4的數字,以及一個換行符,那麼所用到的類應該是這樣:
[a-m1-4\n]
注意在內部的類之間不要有空格.
//⑤字符類----預定義類
代碼 等同於 匹配
----------------------------------------------------------------
. [^\n\r] 除了換行和回車之外的任意字符
\d [0-9] 數字
\D [^0-9] 非數字字符
\s [ \t\n\x0B\f\r] 空白字符
\S [^ \t\n\x0B\f\r] 非空白字符
\w [a-zA-Z_0-9] 單詞字符(所有的字符、數字和下劃線)
\W [^a-zA-Z_0-9] 非單詞字符
-----------------------------------------------------------------
使用預定義字符可以明顯地使模式匹配變得簡單。例如,假設想匹配3個數字:
var sToMatch = "567 9838 abc";
var reThreeNums = /[0-9][0-9][0-9]/;
//var reThreeNums=/\d\d\d/; //用預定義比較簡潔
alert(reThreeNums.test(sToMatch)); //輸出 "true"
2.4量詞
量詞(quantifier)可以指定某個特定模式出現的次數。當指定某個模式應當出現的次數時,可以指定硬性數量,也可以指定軟性數量。
1.簡單量詞
--------------------------------------------------------------------
代碼 描述
--------------------------------------------------------------------
? 出現零次或一次
* 出現零次或多次(任意次)
+ 出現一次或多次(至少出現一次)
{n} 一定出現n次
{n,m} 至少出現n次但不超過m次
{n,} 至少出現n次
--------------------------------------------------------------------
例如,假設想匹配單詞bread,read或red.使用問號量詞,則可以只要使用一個表達式就可以匹配這三個:
var reBreadReadOrRed = /b?rea?d/;
或者var reBreadReadOrRed = /b{0,1}rea{0,1}d/;
2.貪婪的、惰性的和支配性的量詞
貪婪量詞先看整個的字符串是否匹配。如果沒有發現匹配,它去掉該字符串中的最後一個字符,並再次嘗試。如果還是沒有發現匹配,那麼再次去掉最後一個字符,這個過程會一直重復直至到發現一個匹配或者字符串不剩任何字符。
懶性量詞先看字符串中的第一個字母是否匹配。如果單獨這個字符還不夠,就讀入下一個字符,組成兩個字符的字符串。如果還是沒有發現匹配,惰性量詞繼續從字符串中添加字符直到發現匹配或者整個字符串都檢查過也沒有匹配。惰性量詞和貪婪量詞的工作方式恰好相反。
支配量詞只嘗試匹配整個字符串。如果整個字符串不能產生匹配,不做進一步嘗試。支配量詞其實簡單的說,就是一刀切。
--------------------------------------------------------------------
貪婪 惰性 支配 描述
--------------------------------------------------------------------
? ?? ?+ 零次或一次出現
* *? *+ 零次或多次出現
+ +? ++ 一次或多次出現
{n} {n}? {n}+ 恰好n次出現
{n,m} {n,m}? {n,m}+ 至少n次至多m次出現
{n,} {n,}? {n,}+ 至少n次出現
--------------------------------------------------------------------
看下面例子更好的理解以上三種量詞
var str = "abbbaabbbaaabbb1234";
var reg1 = /.*bbb/g;
var reg2 = /.*?bbb/g;
//var reg3 = /.*+bbb/g; //在Visual Studio2008裡報錯.....
var arrMatches1 = str.match(reg1);
var arrMatches2 = str.match(reg2);
//var arrMatches3 = str.match(reg3);
alert("貪婪的:" + arrMatches1.join(",") + "\n惰性的:" + arrMatches2.join(","));
主要是匹配的一個過程不同!

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved