摘要：程序員的正則表達(dá)式，醫(yī)生的處方和道士的鬼畫(huà)符，都是利器。其實(shí)，正則表達(dá)式是一門(mén)語(yǔ)言，有自己獨(dú)特的語(yǔ)法，還擁有自己的解釋器。但是，如果正則表達(dá)式是動(dòng)態(tài)的，是根據(jù)變量來(lái)定義的，那么，只能使用第二種構(gòu)造函數(shù)的方式。

作為一個(gè)程序員，要出去裝逼，手中必備的技能就是正則表達(dá)式。程序員的正則表達(dá)式，醫(yī)生的處方和道士的鬼畫(huà)符，都是利器。

在js中，很多的場(chǎng)景需要去使用到它（畢竟，js剛剛誕生的時(shí)候，是用來(lái)做表單等驗(yàn)證的）。其實(shí)，正則表達(dá)式是一門(mén)語(yǔ)言，有自己獨(dú)特的語(yǔ)法，還擁有自己的解釋器。但是，作為使用來(lái)說(shuō)，我們只需要掌握它的語(yǔ)法，多多運(yùn)用，才能熟練。其實(shí)，我想過(guò)很多種詳解表達(dá)式的方式，但是，似乎每種方式都有缺陷，因?yàn)檎齽t表達(dá)式的語(yǔ)法需要記憶的部分比較多。最后，我覺(jué)得可以通過(guò)比較和分類(lèi)的方式去記憶。如果你喜歡我的文章，歡迎評(píng)論，歡迎Star~。歡迎關(guān)注我的github博客

在正則表達(dá)式中，有兩種方式可以去創(chuàng)建正則表達(dá)式：

字面量

const reg = /abc/;

構(gòu)造函數(shù)

const reg = new RegExp("abc");

對(duì)于這兩種方式，如果正則表達(dá)式是靜態(tài)的，那么，使用第一種字面量的方式，性能會(huì)比較好。但是，如果正則表達(dá)式是動(dòng)態(tài)的，是根據(jù)變量來(lái)定義的，那么，只能使用第二種構(gòu)造函數(shù)的方式。

^ 和 $的對(duì)比

^：匹配字符串的行首。示例說(shuō)明：

const reg = /^A/;

console.log(reg.test("Ant"));    //true
console.log(reg.test(" Ant"));       //false

$：匹配字符串的行尾。示例說(shuō)明：

const reg = /t$/;

console.log(reg.test("eat"));       //true
console.log(reg.test("enter"));       //false

重復(fù)限定符（*、+、？、{n}、{n,}、{n, m}）

*：匹配前一個(gè)字符0次或多次，(x >= 0)

const reg = /a*/;

console.log(reg.test("ba"));      //true
console.log(reg.test("b"));       //true
console.log(reg.test("baaa"));     //true

+：匹配前一個(gè)字符1次或多次，(x >= 1)

const reg = /a+/;

console.log(reg.test("ba"));    //true
console.log(reg.test("baaa"));    //true
console.log(reg.test("b"));     //false

?：匹配前一個(gè)字符的0次或1次，(x = 0 || x = 1)

const reg = /ba?/;

console.log(reg.exec("ba"));      //["ba"]
console.log(reg.exec("baaa"));      //["ba"]
console.log(reg.exec("b"));     //["b"]

注：這里只是指明了?字符的限定符方面的用法，它還可以控制貪婪模式和非貪婪模式(下文可見(jiàn))

{n}: 匹配前一個(gè)字符n次，(x = n)

const reg = /ba{3}/;

console.log(reg.test("ba"));     //false
console.log(reg.test("baaa"));      //true
console.log(reg.test("b"));     //false

{n,}：匹配前一個(gè)字符n次或大于n次，(x >=n)

const reg = /ba{3,}/;

console.log(reg.test("ba"));     //false
console.log(reg.test("baaa"));      //true
console.log(reg.test("baaaa"));      //true
console.log(reg.test("b"));      //false

{n, m}：匹配前一個(gè)字符n次到m次之間，(n <= x <= m)

const reg = /ba{2,3}/;

console.log(reg.test("ba"));     //false
console.log(reg.test("baaa"));     //true
console.log(reg.test("baa"));     //true
console.log(reg.test("b"));      //false

元字符（. 、d、w、s、b）

. ：匹配除換行符以外的所有字符

const reg = /b.?/;

console.log(reg.exec("ba"));     //["ba"]
console.log(reg.exec("bxaa"));      //["bx"]
console.log(reg.exec("bza"));     //["bz"]
console.log(reg.exec("b"));      //["b"]

d：匹配數(shù)字字符，與[0-9]一致（單詞記憶法 => 數(shù)字【digital】）

const reg = /bd/;

console.log(reg.exec("b1"));       //["b1"]
console.log(reg.exec("b2aa"));      //["b2"]
console.log(reg.exec("bza"));      //null
console.log(reg.exec("b"));        //null

w：匹配字母、數(shù)字和下劃線（單詞記憶法 => 單詞【word】）

const reg = /bw/;

console.log(reg.exec("b1"));     //["b1"]
console.log(reg.exec("b2aa"));     //["b2"]
console.log(reg.exec("bza"));      //["bz"]
console.log(reg.exec("b"));       //null

：匹配一個(gè)邊界，一個(gè)獨(dú)立單詞的開(kāi)頭或結(jié)尾（單詞記憶法 => 邊界【border】）

const str = "moon is white";

console.log(str.match(/m/));     //["m"]
console.log(str.match(/oon/));     //["oon"]

s：匹配空白符（空格、換行符、制表符）(單詞記憶法 => 符號(hào)【space】)

const str = "moon is white";

console.log(str.match(/isswhite/));    //["is white"]
console.log(str.match(/moonsis/));    // ["moon is"]

反元字符（[^x]、D、W、B、S）

[^x]：匹配除x之外的任意字符

const reg = /b[^a]/;

console.log(reg.exec("ba"));     //null
console.log(reg.exec("bz"));     //["bz"]
console.log(reg.exec("by"));    //["by"]

D：匹配除數(shù)字之外的任意字符，與d相反

const reg = /bD/;

console.log(reg.exec("b1"));    //null
console.log(reg.exec("b2"));    //null
console.log(reg.exec("by"));     //["by"]

W：匹配除數(shù)字、字母和下劃線以外的任意字符，與w相反

const reg = /bW/;

console.log(reg.exec("b1"));     //null
console.log(reg.exec("ba"));     //null
console.log(reg.exec("b_"));      //null
console.log(reg.exec("b*"));      //["b*"]

B：匹配非單詞邊界的字符，與b相反

const str = "moon is white";

console.log(str.match(/Boon/));     //["oon"]
console.log(str.match(/whitB/));      //["whit"]

S：匹配非空白字符，與s相反

const str = "moon is white";

console.log(str.match(/moSn/));    //["moon"]
console.log(str.match(/whitS/));      //["white"]

字符組（[...]）

[...]：匹配方括號(hào)中的字符集合，例如[0-9] => 匹配數(shù)字字符

const reg = /b[a-z]/;

console.log(reg.test("ba"));      //true
console.log(reg.test("bA"));       //false

分組（(...)）

(X)：將括號(hào)中的字符看成一個(gè)組進(jìn)行匹配，例如(ab)+ => 可以匹配"ababab"

const reg = /(abab)+/;

console.log(reg.exec("ababab"));     //["abab", "abab"]
console.log(reg.exec("abababab"));   //["abababab","abab"]

(?:X)：匹配X，但是不記錄匹配項(xiàng)。而上面的(X)是記錄匹配項(xiàng)的。
(?=X)：正向肯定查找，即匹配后面緊跟X的字符串。

const reg = /d+(?=.)/;

console.log(reg.exec("3.141"))  //["3"]

(?!X)：正向否定查找，即匹配后面不跟X的字符串，與(?:X)相反。

const reg = /d+(?!.)/;

console.log(reg.exec("3.141"))   //["141"]

多選符 （|）

|：匹配兩者中的一個(gè)，例如a|b => 匹配a或b

const reg = /a|b/;

console.log(reg.exec("a"));     //["a"]
console.log(reg.exec("b"));     //["b"]
console.log(reg.exec("c"));      //["c"]

轉(zhuǎn)移字符（）

：表示轉(zhuǎn)義字符，將特殊的字符轉(zhuǎn)義成普通字符進(jìn)行匹配

匹配方式，即正則表達(dá)式在匹配過(guò)程中，當(dāng)具備多個(gè)結(jié)果時(shí)，按照一定的模式進(jìn)行匹配。

匹配方式可分為兩種，貪婪模式和非貪婪模式。

貪婪模式：即以限定符最大重復(fù)標(biāo)準(zhǔn)進(jìn)行匹配。例如：使用/ba*/匹配"baaaaa"時(shí)，結(jié)果可返回"baaaaa"

非貪婪模式：即以限定符最小重復(fù)標(biāo)準(zhǔn)進(jìn)行匹配。例如：使用/ba*?/匹配"baaaaa"時(shí)，結(jié)果可返回"b"

const str = "baaaaa";

console.log(str.match(/ba*/));           //["baaaaa"]
console.log(str.match(/ba*?/));        //["b"]

其中?符號(hào)起到了貪婪與非貪婪模式之間的轉(zhuǎn)變，在重復(fù)限定符后加上?，按非貪婪模式進(jìn)行匹配；默認(rèn)為貪婪模式。

標(biāo)識(shí)方式，就是正則表達(dá)式后面跟的匹配方式，flag

g：全局匹配，記憶方式【global】

i：忽略大小寫(xiě)，記憶方式【ignore】

m：多行搜索，記憶方式【multline】

使用正則表達(dá)式的方式一共有6種，可以分成：reg有兩種，string有四種。

首先，我們來(lái)看一下reg對(duì)象帶的兩種方法：exec和test

test => 判斷字符串中是否存在與正則表達(dá)式匹配的字符串，返回boolean類(lèi)型

測(cè)試用例：

const reg = /abc/;

console.log(reg.test("abca"));     //true
console.log(reg.test("abac"));     //false

exec => 匹配字符串中滿(mǎn)足條件的字符串，返回一個(gè)匹配的結(jié)果數(shù)組

const reg = /d+/;

console.log(reg.exec("1234dhi343sf2"));    //["1234"]

之后是string的四種方法：match、search、replace、split

match：查找字符串中的匹配的字符串，返回一個(gè)結(jié)果數(shù)組，若沒(méi)有匹配則返回null

const str = "this is reg expression test"

console.log(str.match(/i.sw+/)); //["is reg"]

search：查找字符串中匹配的字符串，返回匹配字符串的下標(biāo)，若沒(méi)有匹配則返回-1

const str = "this is reg expression test"

console.log(str.search(/i.sw+/));    //5

replace：查找字符串中匹配的字符串，對(duì)其進(jìn)行替換（這是一個(gè)個(gè)人覺(jué)得比較厲害的技能）

接收字符串

var str = "this is reg expression test"

console.log(str.replace(/(i.)s(w+)/, "$1 hello $2"));    //"this is hello reg expression test"

接收函數(shù)

var str = "this is reg expression test"

str.replace(/(i.)s(w+)/, (...args) => {
   console.log(args);
});    //["is reg", "is", "reg", 5, "this is reg expression test"]

注：這個(gè)函數(shù)會(huì)有一些參數(shù)，第一個(gè)是匹配的字符串，第二個(gè)是第一項(xiàng)匹配的，第三個(gè)是第二項(xiàng)匹配的，第四個(gè)是匹配的下標(biāo)，第五個(gè)是原字符串

split：使用正則表達(dá)式或者固定字符，分割字符串

var str = "this is reg expression test"

console.log(str.split(/s/))   //["this", "is", "reg", "expression", "test"]

js部分的正則表達(dá)式很多東西都以及講完了，剩下的就是練習(xí)了。這種記憶性的東西，需要不斷的使用，才會(huì)孰能生巧。下面部分提供一下練習(xí)的語(yǔ)句，答案在js正則表達(dá)式練習(xí)整理

如果你對(duì)我寫(xiě)的有疑問(wèn)，可以評(píng)論，如我寫(xiě)的有錯(cuò)誤，歡迎指正。你喜歡我的博客，請(qǐng)給我關(guān)注Star~呦。大家一起總結(jié)一起進(jìn)步。歡迎關(guān)注我的github博客