JavaScript 正則表達(dá)式的使用

MyFaith 發(fā)布于2019-08-20 16:02 / 1247人閱讀

摘要：當(dāng)正則表達(dá)式是靜態(tài)不變的，那么使用這種方式將會(huì)獲得更好的性能。使用正則表達(dá)式在中，正則表達(dá)式是通過(guò)對(duì)象的和方法以及字符串內(nèi)置的，，，方法使用的。這些標(biāo)志可以以任何順序多帶帶使用或一起使用，并作為正則表達(dá)式的一部分。

版權(quán)聲明：本文由吳仙杰創(chuàng)作整理，轉(zhuǎn)載請(qǐng)注明出處：https://segmentfault.com/a/1190000009169325

1. 引言

正則表達(dá)式本身語(yǔ)法是一致，只是各編程語(yǔ)法對(duì)正則表達(dá)式的語(yǔ)法表現(xiàn)些區(qū)別。

本文主要是關(guān)于正則在 JavaScript 中的使用。若你對(duì)正則本身還不是很了解的話，強(qiáng)烈推薦先閱讀我的上一篇正則文章——《Java 正則表達(dá)式詳解》。

2. 創(chuàng)建正則表達(dá)式

在 JavaScript 中，我們有兩種創(chuàng)建正則表達(dá)式的方式。

方式一，使用正則表達(dá)式字面量，它由兩個(gè)斜杠包裹，如下所示：

var re = /ab+c/;

正則表達(dá)式字面量會(huì)在腳本加載后編譯。當(dāng)正則表達(dá)式是靜態(tài)不變的，那么使用這種方式將會(huì)獲得更好的性能。

方式二，調(diào)用 RegExp 對(duì)象的構(gòu)造方法，如下所示：

var re = new RegExp("ab+c");

或：

var re = new RegExp(/ab+c/);

在使用構(gòu)造方法時(shí)，正則表達(dá)式是在運(yùn)行時(shí)編譯的，適合正則表達(dá)式會(huì)動(dòng)態(tài)改變的情況下使用。

3. 編寫(xiě)正則表達(dá)式 3.1 特殊字符

特殊字符	含義
	轉(zhuǎn)義字符。反斜杠可以將后面跟著的第一個(gè)普通字符進(jìn)行變成表示特殊含義的特殊字符。比如：/b/ 表示匹配一個(gè)小寫(xiě)字母 "b"，但是 // 卻不匹配任何字符，它變成了一個(gè)邊界字符。反斜杠也可以將后面跟著的第一個(gè)特殊字符變成普通字符。比如： */a/ 表示匹配 0 個(gè)或多個(gè) "a"，但是 /a/* 表示匹配 "a*"。
^	表示匹配字符串的開(kāi)頭。在多行模式下，表示匹配每行的開(kāi)頭。 ^ 如果出現(xiàn)在集合中的第一個(gè)字符，那么它的含義表示否定，比如：[^ab] 表示匹配不是 "a"或 "b" 的字符。
$	表示匹配字符串的結(jié)束。在多行模式下，表示匹配每行的結(jié)束。
*	表示匹配前面的模式 0 次或多次，等同于 /{0,}/。
+	表示匹配前面的模式 1 次或多次，等同于 /{1,}/。
?	表示匹配前面的模式 0 次或 1 次，等同于 {0,1}。如果 ? 是限定符 * 或 + 或 ? 或 {} 后面的第一個(gè)字符，那么表示非貪婪模式（盡可能少的匹配字符），而不是默認(rèn)的貪婪模式。 ? 也可使用在先行斷言（lookahead）模式中。比如：此表格中的 x(?=y) 和 x(?!y)。
.	表示匹配一個(gè)除了換行符外的任意字符。
(x)	表示匹配分組 x，并保存匹配結(jié)果（反向引用（back references）），這組小括號(hào)被稱為捕獲括號(hào)（capturing parentheses）。比如：對(duì)于字符串 "good bad good bad" 的匹配模式 /(good) (bad) 1 2/ 中，(good) 和 (bad) 分別匹配第一個(gè)和第二個(gè)單詞同時(shí)生成對(duì)應(yīng)組的反向引用，其中 1 和 2 分別匹配最后兩個(gè)單詞（但不生成反向引用）。對(duì)于 1，2，，是用來(lái)匹配正則表達(dá)式的一部分。在以正則表達(dá)式替換字符串的語(yǔ)法中，$1，$2，$n 分別表示組一的反向引用、組二的反向引用、組 n 的反向引用，其中 $& 表示匹配所有分組的字符（注意在 Java 中，是用 $0 表示）。比如：console.log("good bad good bad".replace(/(good)s(bad)/, "$1-$2")) 的結(jié)果為 "good-bad good bad"。
(?:x)	表示匹配分組 x 但不產(chǎn)生反向引用，這組小括號(hào)被稱為非捕獲括號(hào)，但可以使我們定義正則表達(dá)式的子表達(dá)式。比如：對(duì)于 /foo{1,2}/ 中的 {1,2} 表示匹配最后的字符 "o" 一次到兩次。對(duì)于 (?:foo){1,2} 中的 {1,2} 表示匹配一組字符 "foo" 一次到兩次。
x(?=y)	表示只匹配后面緊跟著分組 y 的字符 x ，這種模式稱為先行斷言（lookahead）。比如：Jack(?=Sprat\|Frost) 表示只匹配后面跟著 "Sprat" 或 "Frost" 的 "Jack"。
x(?!y)	表示只匹配后面不是緊跟著分組 y 的字符 x，這模式稱為否定先行斷言（lookahead）。比如：/d+(?!.)/ 表示匹配沒(méi)有小數(shù)點(diǎn)的數(shù)字。
x\|y	表示匹配 x 或 y。
{n}	表示匹配前面的模式 n 次。
{n,m}	表示匹配前面的模式最少 n 次，最多 m 次。當(dāng)不指定 m 時(shí)，相當(dāng)于無(wú)空大。
[xyz]	字符集。表示匹配方括號(hào)中指定的任何一個(gè)字符，包括轉(zhuǎn)義字符。其中特殊字符，如小數(shù)點(diǎn) . 和星號(hào) * 在字符集中不是特殊字符，因此不用轉(zhuǎn)義。在方括號(hào)中，可以使用連字符 - 來(lái)指定字符范圍。
[^xyz]	否定字符集。表示匹配不在方括號(hào)中指定的任何一個(gè)字符?？梢允褂?- 來(lái)指定字符范圍。特殊字符的情況和 [xyz] 相同。
[]	表示匹配退隔符（backspace）。注意：不要和混淆。
	表示匹配字邊界。字邊界是指某個(gè)字符的前面和后面都沒(méi)有其它單詞字符（比如除了字符開(kāi)始或字符結(jié)束或 "." 或 "," 或空格等）。注意：匹配的字符邊界不在匹配結(jié)果內(nèi)，同時(shí)不要和 [] 混淆。比如：/m/ 匹配 "moon" 中的 "m"。
B	表示匹配非字邊界。
d	表示匹配一個(gè)數(shù)字字符。相當(dāng)于 [0-9]。
D	表示匹配一個(gè)非數(shù)字字符。相當(dāng)于 [^0-9]。
s	表示匹配一個(gè)空格字符，包括 space, tab, form feed, line feed。相當(dāng)于 [ f vu00a0u1680u180eu2000-u200au2028u2029u202fu205fu3000ufeff]。
S	表示匹配一個(gè)非空格字符。
	表示匹配一個(gè) tab 字符。
w	表示匹配一個(gè)數(shù)字或大小寫(xiě)字母或下劃線。相當(dāng)于 [A-Za-z0-9_]。
W	表示匹配一個(gè)非數(shù)字或大小寫(xiě)字母或下劃線的字符。相當(dāng)于 [^A-Za-z0-9_]。
	n 是一個(gè)正整數(shù)。一個(gè)反向引用（back reference），指向正則表達(dá)式中第 n 個(gè)括號(hào)（從左開(kāi)始數(shù)）中匹配的子字符串。比如：正則表達(dá)式 apple(,)sorange1 匹配字符串 "apple, orange, cherry, peach." 中的字符 "apple, orange,"。
uhhhh	表示匹配一個(gè) unicode 編碼（四個(gè)十六進(jìn)制的數(shù)字）為 "hhhh"的字符。

4. 使用正則表達(dá)式

在 JavaScript 中，正則表達(dá)式是通過(guò) RegExp 對(duì)象的 test和 exec 方法以及字符串 String 內(nèi)置的 search，match，replace，split 方法使用的。

方法	描述
test	RegExp 的一個(gè)根據(jù)正則驗(yàn)證字符串是否有存在匹配項(xiàng)的方法。匹配成功返回 true，反之返回 false。
exec	RegExp 的一個(gè)根據(jù)正則檢索字符串所有匹配項(xiàng)的方法，若有匹配的項(xiàng)則返回 array 數(shù)組對(duì)象，沒(méi)有匹配項(xiàng)則返回 null。
search	字符串內(nèi)置的一個(gè)根據(jù)正則驗(yàn)證字符串是否存在匹配項(xiàng)的方法。匹配成功返回匹配項(xiàng)的開(kāi)始索引 index，反之返回 -1。
match	字符串內(nèi)置的一個(gè)根據(jù)正則檢索字符串所有匹配項(xiàng)的方法，若有匹配的項(xiàng)則返回 array 數(shù)組對(duì)象，沒(méi)有匹配項(xiàng)則返回 null。
replace	字符串內(nèi)置的一個(gè)根據(jù)正則替換字符串匹配項(xiàng)的方法。返回替換后的字符串。
split	字符串內(nèi)置的一個(gè)根據(jù)正則或精確的字符切片字符的方法。返回字符串?dāng)?shù)組 array 對(duì)象。

當(dāng)需要驗(yàn)證字符串是否存在某種模式的時(shí)候用 test 或 search 方法；當(dāng)需要按某種模式截取字符串時(shí)用 exec 或 match 方法。

4.1 exec 和 match 的示例方法

下面的代碼，使用了 exec 獲取匹配的字符數(shù)組對(duì)象：

var myRe = /d(b+)d/g;
var myArray = myRe.exec("cdbbdbsbz");

console.log("myArray", myArray); // 結(jié)果數(shù)組
console.log("myRe", myRe); // 正則
console.log("myRe.lastIndex", myRe.lastIndex); // 下一個(gè)匹配開(kāi)始時(shí)的索引
console.log("myRe.source", myRe.source); // 匹配模式文本

如果不需要訪問(wèn)正則表達(dá)式的屬性，另一種寫(xiě)法為：

var myArray = /d(b+)d/g.exec("cdbbdbsbz"); 

console.log("myArray", myArray); // 結(jié)果數(shù)組
console.log("myRe", myRe); // 正則
console.log("myRe.lastIndex", myRe.lastIndex); // 下一個(gè)匹配開(kāi)始時(shí)的索引
console.log("myRe.source", myRe.source); // 匹配模式文本

如果要通過(guò)構(gòu)造方法創(chuàng)建正則，如下：

var myRe = new RegExp("d(b+)d", "g");
var myArray = myRe.exec("cdbbdbsbz");

console.log("myArray", myArray); // 結(jié)果數(shù)組
console.log("myRe", myRe); // 正則
console.log("myRe.lastIndex", myRe.lastIndex); // 下一個(gè)匹配開(kāi)始時(shí)的索引
console.log("myRe.source", myRe.source); // 匹配模式文本

運(yùn)行結(jié)果：

下面調(diào)用字符串內(nèi)置的 match 方法：

var myRe = /d(b+)d/g;
var myArray = "cdbbdbsbz".match(myRe);

console.log("myArray", myArray); // 結(jié)果數(shù)組
console.log("myRe", myRe); // 正則
console.log("myRe.lastIndex", myRe.lastIndex); // 下一個(gè)匹配開(kāi)始時(shí)的索引
console.log("myRe.source", myRe.source); // 匹配模式文本

運(yùn)行結(jié)果：

總結(jié)：對(duì)于 RegExp 的方法 exec 匹配成功時(shí)，會(huì)返回該數(shù)組并更新正則的全局檢索屬性（lastIndex）；而字符串的方法 match 則不會(huì)更新全局檢索屬性。

4.2 分組與反向引用

對(duì)于正則表達(dá)式中的小括號(hào)會(huì)進(jìn)行模式分組同時(shí)生成保存小括號(hào)匹配項(xiàng)的反向引用。比如：

var re = /(w+)s(w+)/;
var str = "John Smith";
var newstr = str.replace(re, "$2, $1");
console.log(newstr); // 運(yùn)行結(jié)果：Smith, John

4.3 高級(jí)搜索與標(biāo)志（flags）

正則表達(dá)式有五個(gè)可選標(biāo)志，比如，允許全局和不區(qū)分大小寫(xiě)的匹配模式。這些標(biāo)志可以以任何順序多帶帶使用或一起使用，并作為正則表達(dá)式的一部分。

標(biāo)志（flags）	描述
g	global，全局匹配（找到所有匹配，而不是在第一個(gè)匹配后停止）。
i	insensitive，不區(qū)分大小寫(xiě)的匹配（[a-zA-Z]）。
m	multi line，多行匹配，使 ^ 和 $ 匹配每行的開(kāi)始和結(jié)束（不僅僅表示字符串的開(kāi)始和結(jié)束）。
u	unicode，將模式視為 Unicode 序列。
y	sticky，強(qiáng)制模式從上一次匹配后的索引位開(kāi)始匹配。

使用語(yǔ)法：

var re = /pattern/flags;

或者：

var re = new RegExp("pattern", "flags");

5. 參考

Regular Expressions

云服務(wù)器 GPU云服務(wù)器 php郵箱的正則表達(dá) 正則正則表達(dá)式正則匹配正則表達(dá)式 -正則表達(dá)式

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://www.ezyhdfw.cn/yun/82674.html

發(fā)表評(píng)論

登陸后可評(píng)論

0條評(píng)論

MyFaith

男|高級(jí)講師

我要關(guān)注我要私信

TA的文章

什么是網(wǎng)絡(luò)主機(jī)-什么是網(wǎng)絡(luò)主機(jī)？

閱讀 2083·2021-09-22 15:29
小哪吒的風(fēng)火輪來(lái)啦!!!(記 · Loading組件)

閱讀 3419·2019-08-30 15:44
FlexBox學(xué)習(xí) 彈性布局_019

閱讀 3631·2019-08-30 15:43
HTML表單元素及CSS

閱讀 1826·2019-08-30 13:48
你不知道的css技巧

閱讀 1566·2019-08-29 13:56
img[src=""] img無(wú)路徑情況下，灰色邊框去除解決方案

閱讀 2562·2019-08-29 12:12
JavaScript 深拷貝性能分析

閱讀 1035·2019-08-26 11:35
canvas繪制圖表（二）

閱讀 1121·2019-08-26 10:25

亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專欄INFORMATION COLUMN

上云采購(gòu)季！| 2核2G4M爆款云服務(wù)器低至59元/年，更有多臺(tái)、長(zhǎng)期優(yōu)惠，快來(lái)選購(gòu)！

JavaScript 正則表達(dá)式的使用

相關(guān)文章

正則表達(dá)式

JavaScript正則表達(dá)式的匹配模式

***JavaScript* 中的正則表*達(dá)式***

**JS正則表達(dá)式入門(mén)，看這篇就夠了**