共享日常收集JS正則表達式(JavaScript regular expression)

2020-01-20 22:07:54

字體：大中小

來源：轉載

供稿：網友

RegExp直接量和對象的創建

就像字符串和數字一樣，程序中每個取值相同的原始類型直接量均表示相同的值，這是顯而易見的。程序運行時每次遇到對象直接量（初始化表達式）諸如{}和[]的時候都會創建新對象。比如，如果在循環體中寫var a = []，則每次遍歷都會創建一個新的空數組。正則表達式直接量則與此不同，ECMAScript 3規范規定，一個正則表達式直接量會在執行到它時轉換為一個RegExp對象，同一段代碼所表示正則表達式直接量的每次運算都返回同一個對象。ECMAScript 5規范則做了相反的規定，同一段代碼所表示的正則表達式直接量的每次運算都返回新對象。I E一直都是按照EC-MAScript 5規范實現的，多數最新版本的瀏覽器也開始遵循EC-MAScript 5，盡管目前該標準并未全面廣泛推行。

1.1直接量字符

正則表達式中的所有字母和數字都是按照字面含義進行匹配的。JavaScript正則表達式語法也支持非字母的字符匹配，這些字符需要通過反斜線（/）作為前綴進行轉義。比如，轉義字符/n用以匹配換行符。表10-1中列出了這些轉義字符。

表10-1：正則表達式中的直接量字符

字符	匹配
字母和數字字符	自身
/o	NUL字符（/u0000）
/t	制表符（/u0009）
/n	換行符（/u000A）
/v	垂直制表符（/u000B）
/f	換頁符（/u000C）
/r	回車符（/u000D）
/xnn	由十六進制數nn指定的拉丁字符，例如，/x0A等價于/n
/uxxxx	由十六進制數xxxx指定的Unicode字符，例如/u0009等價于/t
/cX	控制字符^X，例如,/cJ等價于換行符/n
在正則表達式中，許多標點符號具有特殊含義，它們是：^ $ . * + ? = ! : \| / / ( ) [ ] { }

正則表達式“///”用以匹配任何包含反斜線的字符串。

1.2字符類

例如，/[/u0400-/u04FF]/用以匹配所有的Cyrillic字符）。

表10-2：正則表達式的字符類

字符	匹配
[...]	方括號內的任意字符
[^...]	不在方括號內的任意字符
.	除換行符和其他Unicode行終止符之外的任意字符
/w	任何ASCII字符組成的單詞，等價于[a-zA-Z0-9]
/W	任何不是ASCII字符組成的單詞，等價于[^a-zA-Z0-9]
/s	任何Unicode空白符
/S	任何非Unicode空白符的字符，注意/w和/S不同
/d	任何ASCII數字，等價于[0-9]
/D	除了ASCII數字之外的任何字符，等價于[^0-9]
/b	退格直接量(特例)

注意，在方括號之內也可以寫這些特殊轉義字符。比如，由于/s匹配所有的空白字符，/d匹配的是所有數字，因此/[/s/d]/就匹配任意空白符或者數字。注意，這里有一個特例。下面我們將會看到轉義符/b具有的特殊含義，當用在字符類中時，它表示的是退格符，所以要在正則表達式中按照直接量表示一個退格符，只需要使用具有一個元素的字符類/[/b]/。

1.3重復

我們在正則模式之后跟隨用以指定字符重復的標記。由于某些重復種類非常常用，因此就有一些專門用于表示這種情況的特殊字符。例如，“+”用以匹配前一個模式的一個或多個副本。表10-3總結了這些表示重復的正則語法。

表10-3：正則表達式的重復字符語法

字符	含義
{n,m}	匹配前一項至少n次,但不能超過m次
{n,}	匹配前一項至少n次
{n}	匹配前一頂n次
?	匹配前一項0次或者1次，也就是說前一項是可選的，等價于{0,1}
+	匹配前一項1次或多次，等價于{1,}
*	匹配前一項0次或多次，等價于{0,}

這里有一些例子：

//d{2,4}/ // 匹配2～4個數字

//w{3}/d?/ // 精確匹配三個單詞和一個可選的數字

//s+java/s+/ // 匹配前后帶有一個或多個空格的字符串"java"

/[^(]/ // 匹配一個或多個非左括號的字符

在使用“”和“?”時要注意，由于這些字符可能匹配0個字符，因此它們允許什么都不匹配。例如，正則表達式/a*/實際上與字符串“bbbb”匹配，因為這個字符串含有0個a。

非貪婪的重復

表10-3中列出的匹配重復字符是盡可能多地匹配，而且允許后續的正則表達式繼續匹配。因此，我們稱之為“貪婪的”匹配。我們同樣可以使用正則表達式進行非貪婪匹配。只須在待匹配的字符后跟隨一個問號即可：“??”、“+?”、“*?”或“{1,5}?”。比如，正則表達式/a+/可以匹配一個或多個連續的字母a。當使用“aaa”作為匹配字符串時，正則表達式會匹配它的三個字符。但是/a+?/也可以匹配一個或多個連續字母a，但它是盡可能少地匹配。我們同樣將“aaa”作為匹配字符串，但后一個模式只能匹配第一個a。

使用非貪婪的匹配模式所得到的結果可能和期望并不一致?？紤]以下正則表達式/a+b/，它可以匹配一個或多個a，以及一個b。當使用“aaab”作為匹配字符串時，它會匹配整個字符串?，F在再試一下非貪婪匹配的版本/a+?b/，它匹配盡可能少的a和一個b。當用它來匹配“aaab”時，你期望它能匹配一個a和最后一個b。但實際上，這個模式卻匹配了整個字符串，和該模式的貪婪匹配一模一樣。這是因為正則表達式的模式匹配總是會尋找字符串中第一個可能匹配的位置。由于該匹配是從字符串的第一個字符開始的，因此在這里不考慮它的子串中更短的匹配。

1.4選擇、分組和引用

正則表達式的語法還包括指定選擇項、子表達式分組和引用前一子表達式的特殊字符。字符“|”用于分隔供選擇的字符。例如，/ab|cd|ef/可以匹配字符串“ab”，也可以匹配字符串“cd”，還可以匹配字符串“ef”。//d{3}|[a-z]{4}/匹配的是三位數字或者四個小寫字母。

注意，選擇項的嘗試匹配次序是從左到右，直到發現了匹配項。如果左邊的選擇項匹配，就忽略右邊的匹配項，即使它產生更好的匹配。因此，當正則表達式/a|ab/匹配字符串“ab”時，它只能匹配第一個字符。

表10-4：正則表達式的選擇、分組和引用字符

字符	含義
\|	選擇，匹配的是該符號左邊的子表達式或右邊的子表達式
(...)	組合，將幾個項組合為一個單元，這個單元可通過“*”、“+”、“？”和“\|”等符號加以修飾，而且可以記住和這個組合相匹配的字符串以供此后的引用使用
(?:...)	只組合，把項組合到一個單元，但不記憶與該組相匹配的字符
/n	和第n個分組第一次匹配的字符相匹配，組是圓括號中的子表達式（也有可能是嵌套的），組索引是從左到右的左括號數，“(?:”形式的分組不編碼

1.5指定匹配位置

正如前面所介紹的，正則表達式中的多個元素才能夠匹配字符串的一個字符。例如，/s匹配的只是一個空白符。還有一些正則表達式的元素匹配的是字符之間的位置，而不是實際的字符。
最常用的錨元素是^，它用來匹配字符串的開始，錨元素$用以匹配字符串的結束。

表10-5：正則表達式中的錨字符

字符	含義
^	匹配字符串的開頭，在多行檢索中，匹配一行的開頭
$	匹配字符串的結尾，在多行檢索中，匹配一行的結尾
/b	匹配一個單詞的邊界，簡言之，就是位于字符/w和/W之間的位置，或位于字符/w和字符串的開頭或者結尾之間的位置（但需要注意，[/b]匹配的是退格符）
/B	匹配非單詞邊界的位置
(?=p)	零寬正向先行斷言，要求接下來的字符都與p匹配，但不能包括匹配p的那些字符
(?!p)	零寬負向先行斷言，要求接下來的字符不與p匹配

1.6修飾符

正則表達式中的語法還有最后一個知識點，即正則表達式的修飾符，用以說明高級匹配模式的規則。和之前討論的正則表達式語法不同，修飾符是放在“/”符號之外的，也就是說，它們不是出現在兩條斜線之間，而是第二條斜線之后。JavaScript支持三個修飾符，修飾符“i”用以說明模式匹配是不區分大小寫的。修飾符“g”說明模式匹配應該是全局的，也就是說，應該找出被檢索字符串中所有的匹配。修飾符“m”用以在多行模式中執行匹配，在這種模式下，如果待檢索的字符串包含多行，那么^和$錨字符除了匹配整個字符串的開始和結尾之外，還能匹配每行的開始和結尾。比如正則表達式/java$/im可以匹配“java”也可以匹配“Java/nis fun”。

表10-6：正則表達式修飾符

字符	含義
i	執行不區分大小寫的匹配
g	執行一個全局匹配，簡言之，即找到所有的匹配，而不是在找到第一個之后就停止
m	多行匹配模式，^匹配一行的開頭和字符串的開頭，$匹配行的結束和字符串的結束

2.用于模式匹配的String方法

2.1search()

它的參數是一個正則表達式，返回第一個與之匹配的子串的起始位置，如果找不到匹配的子串，它將返回-1。
如果search()的參數不是正則表達式，則首先會通過RegExp構造函數將它轉換成正則表達式，search()方法不支持全局檢索，因為它忽略正則表達式參數中的修飾符g。

復制代碼代碼如下:

"JavaScript".search(/script/i); //4

2.2replace()

replace()方法用以執行檢索與替換操作。其中第一個參數是一個正則表達式，第二個參數是要進行替換的字符串。

"JavaScript".replace(/javascript/gi, "a")  //"a"http:// 一段引用文本起始于引號，結束于引號// 中間的內容區域不能包含引號var quote = /"([^"]*)"/g;// 用中文半角引號替換英文引號，同時要保持引號之間的內容（存儲在$1中）沒有被修改text.replace(quote, '“$1”');

2.3match()

match()方法是最常用的String正則表達式方法。它的唯一參數就是一個正則表達式（或通過RegExp()構造函數將其轉換為正則表達式），返回的是一個由匹配結果組成的數組。

"1 plus 2 equals 3".match(//d+/g) // 返回 ["1", "2", "3"]例如，使用如下的代碼來解析一個URL：var url = /(/w+):////([/w.]+)//(/S*)/;var text = "Visit my blog at http://www.example.com/~david";var result = text.match(url);if (result != null) {   var fullurl = result[0];  // 包含 "http://www.example.com/~david"   var protocol = result[1];  // 包含 "http" var host = result[2];  // 包含 "www.example.com"   var path = result[3];  // 包含 "~david"}

2.4split()

這個方法用以將調用它的字符串拆分為一個子串組成的數組，使用的分隔符是split()的參數

復制代碼代碼如下:

"123,456,789".split(","); // 返回 ["123","456","789"]

split()方法的參數也可以是一個正則表達式，這使得split()方法異常強大。例如，可以指定分隔符，允許兩邊可以留有任意多的空白符：

復制代碼代碼如下:

"1, 2, 3, 4, 5".split(//s*,/s*/); // 返回 ["1","2","3","4","5"]

3.RegExp對象

正則表達式是通過RegExp對象來表示的。除了RegExp()構造函數之外，RegExp對象還支持三個方法和一些屬性。
RegExp()構造函數帶有兩個字符串參數，其中第二個參數是可選的，RegExp()用以創建新的RegExp對象。第一個參數包含正則表達式的主體部分，也就是正則表達式直接量中兩條斜線之間的文本。需要注意的是，不論是字符串直接量還是正則表達式，都使用“/”字符作為轉義字符的前綴，因此當給RegExp()傳入一個字符串表述的正則表達式時，必須將“/”替換成“/”。RegExp()的第二個參數是可選的，如果提供第二個參數，它就指定正則表達式的修飾符。不過只能傳入修飾符g、i、m或者它們的組合。比如：

// 全局匹配字符串中的5個數字，注意這里使用了"http://"，而不是"/"var zipcode = new RegExp("//d{5}", "g");

3.1 RegExp的屬性

每個RegExp對象都包含5個屬性。屬性source是一個只讀的字符串，包含正則表達式的文本。屬性global是一個只讀的布爾值，用以說明這個正則表達式是否帶有修飾符g。屬性ignore-Case也是一個只讀的布爾值，用以說明正則表達式是否帶有修飾符i。屬性multiline是一個只讀的布爾值，用以說明正則表達式是否帶有修飾符m。最后一個屬性lastIndex，它是一個可讀/寫的整數。如果匹配模式帶有g修飾符，這個屬性存儲在整個字符串中下一次檢索的開始位置，這個屬性會被exec()和test()方法用到，下面會講到。

屬性	描述	FF	IE
global	RegExp 對象是否具有標志 g。	1	4
ignoreCase	RegExp 對象是否具有標志 i。	1	4
lastIndex	一個整數，標示開始下一次匹配的字符位置。	1	4
multiline	RegExp 對象是否具有標志 m。	1	4
source	正則表達式的源文本。	1	4

3.2 RegExp的方法

RegExp對象定義了兩個用于執行模式匹配操作的方法。它們的行為和上文介紹過的String方法很類似。RegExp最主要的執行模式匹配的方法是exec()，它與10.2節介紹過的String方法match()相似，只是RegExp方法的參數是一個字符串，而String方法的參數是一個RegExp對象。

方法	描述	FF	IE
compile	編譯正則表達式。	1	4
exec	檢索字符串中指定的值。返回找到的值，并確定其位置。	1	4
test	檢索字符串中指定的值。返回 true 或 false。	1	4

3.2.1exec()

var pattern = /Java/g;var text = "JavaScript is more fun than Java!";var result;while ((result = pattern.exec(text)) != null) {   alert("Matched '" +  result[0] + "'" +     " at position " + result.index +    ";  next search begins at " + pattern.lastIndex);}

3.2.2test()

另外一個RegExp方法是test()，它比exec()更簡單一些。它的參數是一個字符串，用test()對某個字符串進行檢測，如果包含正則表達式的一個匹配結果，則返回true：

復制代碼代碼如下:

var pattern = /java/i;pattern.test("JavaScript"); // 返回 true

4.常用正則表達式

//電話號碼

/^([/+][0-9]{1,3}([ /./-])?)?([/(][0-9]{1,6}[/)])?([0-9 /./-]{1,32})(([A-Za-z /:]{1,11})?[0-9]{1,4}?)$/

//郵箱

//日期(YYYY-MM-DD)

/^/d{4}[///-](0?[1-9]|1[012])[///-](0?[1-9]|[12][0-9]|3[01])$/

//IPV4
/^((([01]?[0-9]{1,2})|(2[0-4][0-9])|(25[0-5]))[.]){3}(([0-1]?[0-9]{1,2})|(2[0-4][0-9])|(25[0-5]))$/

//URL
/^(https?|ftp):////(((([a-z]|/d|-|/.|_|~|[/u00A0-/uD7FF/uF900-/uFDCF/uFDF0-/uFFEF])|(%[/da-f]{2})|[!/$&'/(/)/*/+,;=]|:)*@)?(((/d|[1-9]/d|1/d/d|2[0-4]/d|25[0-5])/.(/d|[1-9]/d|1/d/d|2[0-4]/d|25[0-5])/.(/d|[1-9]/d|1/d/d|2[0-4]/d|25[0-5])/.(/d|[1-9]/d|1/d/d|2[0-4]/d|25[0-5]))|((([a-z]|/d|[/u00A0-/uD7FF/uF900-/uFDCF/uFDF0-/uFFEF])|(([a-z]|/d|[/u00A0-/uD7FF/uF900-/uFDCF/uFDF0-/uFFEF])([a-z]|/d|-|/.|_|~|[/u00A0-/uD7FF/uF900-/uFDCF/uFDF0-/uFFEF])*([a-z]|/d|[/u00A0-/uD7FF/uF900-/uFDCF/uFDF0-/uFFEF])))/.)+(([a-z]|[/u00A0-/uD7FF/uF900-/uFDCF/uFDF0-/uFFEF])|(([a-z]|[/u00A0-/uD7FF/uF900-/uFDCF/uFDF0-/uFFEF])([a-z]|/d|-|/.|_|~|[/u00A0-/uD7FF/uF900-/uFDCF/uFDF0-/uFFEF])*([a-z]|[/u00A0-/uD7FF/uF900-/uFDCF/uFDF0-/uFFEF])))/.?)(:/d*)?)(//((([a-z]|/d|-|/.|_|~|[/u00A0-/uD7FF/uF900-/uFDCF/uFDF0-/uFFEF])|(%[/da-f]{2})|[!/$&'/(/)/*/+,;=]|:|@)+(//(([a-z]|/d|-|/.|_|~|[/u00A0-/uD7FF/uF900-/uFDCF/uFDF0-/uFFEF])|(%[/da-f]{2})|[!/$&'/(/)/*/+,;=]|:|@)*)*)?)?(/?((([a-z]|/d|-|/.|_|~|[/u00A0-/uD7FF/uF900-/uFDCF/uFDF0-/uFFEF])|(%[/da-f]{2})|[!/$&'/(/)/*/+,;=]|:|@)|[/uE000-/uF8FF]|//|/?)*)?(/#((([a-z]|/d|-|/.|_|~|[/u00A0-/uD7FF/uF900-/uFDCF/uFDF0-/uFFEF])|(%[/da-f]{2})|[!/$&'/(/)/*/+,;=]|:|@)|//|/?)*)?$/i

//數字(允許 +-123,123.123)

/^[/-/+]?((([0-9]{1,3})([,][0-9]{3})*)|([0-9]+))?([/.]([0-9]+))?$/

//2-20個英文或中文字符
/^([/u4e00-/u9fa5]{2,20})$|^([a-zA-Z]{2,20})$

上一篇：12個常用的js正則表達式

下一篇：PHP正則表達式基礎入門