初探正則表達式

正則表達式--regular expression

說到正則表達式，不少前端小夥伴們是望而卻步或者淺嘗而止，感受其難以理解。其實正則表達式並無那麼複雜，只要你清晰地知道你想要解決的問題並學會使用正則表達式，那麼你就能夠輕易地解決這些問題。

正則表達式在線理解工具

用途

正則表達式（簡稱regex）是一種工具和其餘工具同樣，他是爲了解決某一類專門的問題發明的。

例如：

• 你正在搜索一個文件中的size單詞或者想要替換全部的size單詞，可是不想要替換包括size的單詞好比fontsize這樣的就不替換。
• 你想要檢查一個表單中郵箱或者手機號是不是正確的語法格式。
• 你只想搜索某個文件裏特定位置的某個單詞，好比行首或者行尾。

這些問題實際上是咱們寫程序時候常常能遇到的，咱們也能夠經過條件處理和字符串操做來解決它們，可是你的解決方案會十分的複雜。

可是，這些問題咱們均可以使用一些精心構造的正則表達式語句來解決。

什麼是正則表達式

簡單來講正則表達式是一些用來匹配和處理文本的字符串。它是文本處理方面功能最強大的工具之一。正則表達式語言用來構造正則表達式，正則表達式用來完成搜索和替換的操做。

如下的例子都是合法的正則表達式：

.ber
.
www\.tyweb\.top
[a-zA-z0-9_.]*
<[Hh]1>.*</[Hh]1>
\r\n\r\n
\d{3,3}-\d{3,3}-\d{4,4}

匹配單個字符串

1. 匹配純文本

---

- 文本 -

hello world！hello web！

- 正則表達式 -

hello

- 結果 -

==hello== world！==hello== web！

---

這裏使用正則表達式的是純文本，它將匹配原始文本里面的全部hello。

字母大小寫的問題：正則表達式是區分大小的，因此hello不匹配Hello，不過絕大數的正則表達式的實現也支持不區分大小寫的匹配操做，好比JavaScript中用戶可使用i標誌來強制執行一次不區分字母大小寫的搜索。

2. 匹配任意字符串

---

- 文本 -

web1

web2

ty

wee

wee

web3df

1web2

- 正則表達式 -

web.

- 結果 -

==web1==

==web2==

ty

wee

wee

==web3==df

1==web2==

---

在正則表達式中特殊自負牀用來給出要搜索的內容，" . "能夠匹配任何一個單個的字符。固然，在同一個正則表達式中容許出現多個"."，而且它既能夠連續出現，也能夠間隔這出如今模式的不一樣位置。

3. 匹配特殊字符串

剛剛咱們有說到"."的用法，而且一些特殊字符有一些特殊的用法，那麼問題來了，若是咱們在須要匹配的字符串中有這些字符串，而咱們有想要匹配出來怎麼辦呢。

咱們須要想辦法高速正則表達式你須要的是"."自己而不是他在正則表達式中的特殊含義。因此咱們在它前面加上一個（反斜槓）來對它進行轉義。

---

- 文本 -

web1

2web2

ty

wee

web3df

1web.2

- 正則表達式 -

.web\.

- 結果 -

web1

2web2

ty

wee

web3df

==1web.==
2

---

匹配一組字符串

1. 匹配多個字符串中的一個和利用字符區間

上面咱們有說過如何匹配單個字符串，可是若是如今有一個文件列表。咱們只想找出.是包含咱們想要字母的文件怎麼辦？看例子：

- 文本 -

aweb.html

cweb.html

ty.html

wee.html

web3.html

1web.html

- 正則表達式 -

[ac]web\.html

- 結果 -

==aweb.html==

==cweb.html==

ty.html

wee.html

web3.html

1web.html

---

能夠看到咱們這裏使用 [ac]做爲開頭，這個集合將只匹配字符a或c。咱們能夠多處使用[]來使得咱們的表達式更加靈活，固然咱們是須要根據須要來作的。

固然咱們若是想要匹配a到z的話固然不多是寫那麼多字母模式[a~z]是徹底等價的，相同道理的還有[0~9]。

2. 取非匹配

字符集合一般用來指定一組必須匹配其中之一的字符。可是某些場合，咱們須要反過來作，給出一組不須要獲得的字符，換句話說，除了那個字符集合裏的字符，其餘字符均可以匹配。

- 文本 -

aweb.html

cweb.html

ty.html

wee.html

web3.html

1web.html

- 正則表達式 -

[^0~9]web\.html

- 結果 -

==aweb.html==

==cweb.html==

ty.html

wee.html

web3.html

1web.html

---

3. 使用元字符串

元字符串是一些在正則表達式裏有特殊含義的字符，相似 . ， ] 因此這些字符就沒法用來表示自身，固然以前咱們也說過咱們在元字符串的前面加上一個反斜槓\來進行轉義，讓其匹配自身。
好比下面這個例子咱們想匹配 arr[0] 。

- 代碼 -

var arr = new Array();

console.log(arr[0].length);

- 正則表達式 -

arr\[0\]

固然這個例子有點小題大作，咱們平時狀況下遇到同時匹配arr[1] arr[2] arr[3] 等狀況纔會用到正則。

4. 匹配空白字符

元字符	說明
[\b]	回退（並刪除）一個字符（Backspace鍵）
\f	換頁符
\n	換行符
\r	回車符
\t	制符表（Tab按鍵）
\v	垂直製表符

通常狀況來講咱們匹配 \r \n \t 的狀況稍微多見一些。

5. 匹配特定的字符類別

元字符	說明
\d	任何一個數字字符（等價於 [0~9]）
\D	任何一個非數字字符（等價於 [^0~9]）
\w	任何一個字母數字字符（大小寫都可）或下劃線字符 （等價於[a-zA-Z0-9_]）
\W	任何一個非字母數字字符或非下劃線字符（等價於[^a-zA-Z0-9_]）
\s	任何一個空白字符（等價於[\f\n\r\t\v]）
\S	任何一個非空白字符（等價於[^\f\n\r\t\v]）

6. 匹配十六或者八進制數值

這裏就不詳細介紹，咱們須要知道的hi正則能作到這一點相似匹配十六進制 \x0A 其實和等價於 \n ，匹配八進制 \011 等價於 \t 。

7. 使用POSIX字符

++首先：JavaScrip是不支持在正則表達式中使用POSIX字符的。++

稍做了解，POSIX字符類是一種簡寫的形式

字符類	說明
[:alnum:]	任何一個字母或者數字（等價於 [a-zA-Z0-9] ）
[:alpha:]	任何一個字母（等價於 [a-zA-Z] ）
[:blank:]	空格或者製表符 (等價於 [\t ] )
[:cntrl:]	ASCII控制字符（ASCII0到31加上127）
[:digit:]	任何一個數字（等價於 [0-9]）
[:graph:]	和 [:print:] 同樣可是不包括空格
[:lower:]	任何一個小寫字母（等價於 [a-z] ）
[:print:]	任何一個可打印字符
[:punct:]	不屬於 [:alnum:] 和 [:cntrl:] 的任何一個字符
[:space:]	任何一個空白字符（等價於 [^\f\n\r\t\v ] ）
[:upper:]	任何一個小寫字母（等價於 [A-Z] ）
[:xdigit:]	任何一個十六進制數字（等價於 [a-fA-F0-9] ）

重複匹配

從以前所瞭解的匹配規則中咱們學會了使用各類元字符，字符集，字符類去匹配單個字符。可是當咱們想要匹配出一個相似 loulan@qq.com 這樣的郵箱呢？

1. 匹配一個或者多個字符

- 文本 -

hello everyone, you can email me to loulan@qq.com or loulou@qq.com.

- 正則表達式 -

\w+@\w+\.\w+

- 結果 -

hello everyone, you can email me to ==loulan@qq.com== or ==loulou@qq.com==.

---

想要匹配同一個字符或者字符集的屢次重複（不包括0次），只要簡單的給這個字符或者字符集加上一個 + 字符做爲後綴便可。好比 [0-9] 匹配一個數字， [0-9]+ 匹配一個或者多個連續的數字。

須要注意的是給字符集加上 + 後綴的時候必須放在字符集 [] 的外面。否則就是匹配或者 + 的單個字符了。

其實咱們剛剛的這個表達式若是遇到 ty.top.@qq.com 就會出現問題。仔細的你會在下面找到答案。

2. 匹配零個或者多個字符

先看一個實例，這段的匹配出現了小問題。 .loulan@qq.com 帶上了咱們不須要的 . 。

- 文本 -

hello everyone, you can email me to ty.top@qq.com or loulou@qq.com.

- 正則表達式 -

[\w.]+@[\w.]+\.\w+

- 結果 -

hello everyone, you can email me to ==ty.top@qq.com== or ==.loulou@qq.com==.

---

其實這種匹配模式須要使用 * 來進行匹配他的用法和 + 同樣，可是它能匹配該字符或者字符集零次或者屢次出現的狀況。

- 文本 -

hello everyone, you can email me to ty.top@qq.com or loulou@qq.com.

- 正則表達式 -

\w+[\w.]*@[\w.]+\.\w+

- 結果 -

hello everyone, you can email me to ==ty.top@qq.com== or .==loulou@qq.com==.

---

能夠稍微理解下這個表達式每一個字符所表明的意義，以及爲何能解決咱們的問題。

3. 匹配零個或者一個字符

有了一個多個，零個多個，怎麼會少了零個或者一個字符的匹配呢。用法和+ *同樣，只不過規則不同了。咱們看下區別：

- 文本 -

http://www.baidu.com/

https://www.baidu.com/

- 正則表達式 -

http://[\w./]+

- 結果 -

==http://www.baidu.com/==

https://www.baidu.com/

---

- 文本 -

http://www.baidu.com/

https://www.baidu.com/

- 正則表達式 -

https?://[\w./]+

- 結果 -

==http://www.baidu.com/==

==https://www.baidu.com/==

---

有些同窗會發現其實在字符集中有些元字符並無進行轉義，可是匹配仍是成功了。通常來講在字符集中間的的元字符會被解釋成普通字符，不須要轉義，固然，轉義了的話也沒有任何壞處，也仍是能匹配成功的。

4. 防止過分匹配

咱們看一個問題：

- 文本 -

<i>left</i>  middle <i>right</i>

- 正則表達式 -

<[iI]>.*</[iI]>

- 結果 -

==一整行都被匹配（ps：markdown玩不6的樓主）==

---

咱們分析一下這個問題，實際上是由於.其實匹配了中間部分的全部字符而沒有適可而止將他們分開進行匹配。那麼咱們怎麼讓它適可而止呢？

- 文本 -

<i>left</i>  middle <i>right</i>

- 正則表達式 -

<[iI]>.*?</[iI]>

---

很簡單的咱們在 * 後面加了 ? 就可讓它再也不貪婪，咱們把加上 ? 的 * 叫作他的惰性版本。

其實剛剛說的這些都是正則匹配裏的數字元量符號，同樣的使用方法有如下數字元量符：

數字元量符	說明
*	匹配前一個字符或者字符集的零次或者屢次出現
+	匹配前一個字符或者字符集的一次或者屢次出現
?	匹配前一個字符或者字符集的一次或者零次出現
{n}	匹配前一個字符或者字符集的n次重複
{m,n}	匹配前一個字符或者字符集的至少m次至多n次的重複
{n, }	匹配一個字符或者字符集的n次或者更屢次重複
*?	*的惰性版本
+?	+的惰性版本
{n, }?	{n, }的惰性版本

位置匹配

咱們遇到這麼一個問題，咱們只想匹配arry這個單個單詞，可是它匹配到了咱們不想要的內容:

- 文本 -

arry in tyarryIt.com

- 正則表達式 -

arry

- 結果 -

==arry== in ty==arry==It.com

---

1. 單詞邊界

咱們須要一個規則來限制邊界，\b能夠作到，他限制了一個單詞的開始或者結尾

- 文本 -

arry in tyarryIt.com

- 正則表達式 -

\barry\b

- 結果 -

==arry== in tyarryIt.com

---

這裏咱們只匹配 arry 自己，因此咱們在先後都加入 \b 。固然咱們能夠只在開頭或者結尾使用來找到以咱們想要單詞做爲開頭或者結尾的單詞。

須要注意的是\b只匹配位置不匹配字符。有些正則還支持另外兩種元字符 \< \> 只匹配單詞的開頭和結束，不過支持他們的正則表達式引擎並很少。

與之相反\B代表不匹配一個單詞邊界。

2. 字符串邊界

用來定義字符串邊界的元字符有兩個，一個是用來定義字符串開頭的 ^ 另外一個是匹配字符串結尾的 $ 。其使用方法是和單詞邊界一致的。

位置元字符	說明
^	匹配字符串的開頭
\A	匹配字符串的開頭
$	匹配字符串的結束
\Z	匹配字符串的結束
<	匹配單詞開頭
>	匹配單詞結束
\b	匹配單詞邊界
\B	和\b相反

使用子表達式

子表達式

讓咱們思考一下下面這個正則：

- 文本 -

arry innbsp;nbsp;tyarryIt.com

- 正則表達式 -

nbsp;{2, }

從表達式中咱們能知道寫這個表達式的本意是想匹配連續的 nbsp;。可是這個表達式並不能達到咱們預期的結果，由於 {2, } 只會匹配其前面緊挨的字符。因此只能匹配nbsp;;這樣的字符串，可是沒法匹配 nbsp;nbsp; 這樣的字符串。

上面這個表達式就引出了子表達式的概念，子表達式是一個更強大的表達式的一部分，把表達式劃分紅一系列的表達式是爲了把那些子表達式看成一個獨立的元素來使用。子表達式必須使用 () 來括起來。

這樣再讓咱們完美解決上面的需求：

- 文本 -

arry innbsp;nbsp;tyarryIt.com

- 正則表達式 -

(nbsp;){2, }

這樣的話 (nbsp;) 是一個表達式。它將被視爲一個獨立的元素，而他後面的 {2, } 將做用域這個子表達式。

子表達式的嵌套

子表達式容許嵌套，而且容許多重的嵌套，這種嵌套，在層次上理論沒有限制，可是在咱們的工做中固然是須要適可而止的。太多的嵌套會讓匹配模式變得難以閱讀和理解。

回溯引用-先後一致匹配

先後一致的問題讓咱們不由想到HTML的標籤：

- 文本 -

<body>
<h1>it is h1</h1>
<h2>it is h2</h2>
<h3>it is h3</h3>
<h4>it is h4</h5>
</body>

- 正則表達式 -

<[hH][1-6]>.*?</[hH[1-6]]>

這多是咱們在想到匹配標籤時候內心的第一想法。

可是，細心的同窗會發現咱們最後的一個標籤 <h4>***</h5> 由於手誤寫錯了。可是思考一下咱們發現，這種錯誤的地方也會被成功匹配。那咱們怎樣才能先後一致進行匹配呢？

回溯引用匹配

下面這個表達式把字符串中重複的幾個單詞匹配出來了。

- 文本 -

Try you you best and and you will win win the game.

- 正則表達式 -

[ ]+(\w+)[ ]+\1

- 結果 -

Try ==you you== best ==and and== you will ==win win== the game.

咱們來分析一下上面的表達式，[ ]+ 匹配一個或者多個空格，\w+ 匹配一個或者多個字母或者數字，隨後，[ ]+ 匹配一個或者多個空格，而 (\w+) 又是一個子表達式，固然這裏子表達式不是用來作重複匹配的，這裏只是把這部分表達式單獨劃分出來以便在後面進行引用。最後一部分 \1 這就是一個回溯引用，而它引用的是前面劃分出來的那個子表達式，他的意思是當前面的 \w+ 匹配到 you 的時候他也匹配 you，前面的\w+ 匹配到 and 的時候他也匹配 and。固然若是有多個子表達式 \1 \2 \3 分別表明模式裏的第一，第二，第三個表達式，咱們能夠把回溯引用想象成一個變量的重複調用。

先後查找：

往前查找

- 文本 -

https://www.tyweb.top/

http://www.tyweb.top/

ftp://ftp.tyweb.top/

- 正則表達式 -

.+(?=:)

- 結果 -

==https==://www.tyweb.top/

==http==://www.tyweb.top/

==ftp==://ftp.tyweb.top/

---

在上面的正則表達式中 .+ 匹配任意文本，子表達式 ?=: 匹配 : ，可是須要注意的是 : 並無出如今最終的結果中，咱們用?=:代表的是，只要找到 : 就能夠了，不要包括在最終的匹配結果裏。用術語來講就是「不消費」它。

日後查找

?<= 用來作向後查找，用法和向前查找大同小異。

往前日後查找相結合

咱們直接匹配標籤中間的文本：

- 文本 -

##### - 正則表達式 -

(?<=<[bB]>).*(?=</[bB]>)

```

嵌入條件

正則表達式裏的條件要用 ? 來定義。事實上，大家一家見過幾種很是特定的條件了。

• ? 匹配前一個字符或者表達式
• /= 和 ?<= 匹配前面或者後面的文本，若是它存在的話。

嵌入條件語法也使用了 ? ,由於嵌入條件不外乎下面兩種狀況

• 根據一個回溯引用來進行條件處理
• 根據一個先後查找來進行條件處理

元字符	說明
()	定義一個子表達式
\n	匹配第n個子表達式
?=	向後查找
?<=	向前查找
?!	負向前查找
?<!	負向後查找
?()	條件(if then)
?()|	條件(if then else)