JavaScript中的正則表達式解析(一)——數字的匹配

前言

說到讓人頭疼的,莫過於正則表達式了,誰能告訴我那一堆看起來像亂碼的東西,到底匹配的是什麼(抓狂臉!),不用心急,不用焦躁,下面我們就來徹底的瞭解一下正則表達式。——媽媽再也不用擔心我看不懂正則表達式了。(^▽^)。

是什麼?

認識一個新事物的第一步——搞清楚它是什麼。正則表達式是匹配字符串中字符組合的模式。首先,正則表達式是用於匹配字符串的,數組什麼的靠邊站,其次正則表達式就是一種模式,說白了就是和模式一樣的,咱就匹配它,和模式不一樣的咱理都不理。

怎麼用?

搞清楚了正則表達式是幹什麼的,下面我們就要了解它的使用方法了。要想使用正則表達式,首先第一步——當然是構造它啦,不把人家創建出來,怎麼使用啊。

創建一個正則表達式
你有兩種方式來創建一個正則表達式:

1、使用正則表達式的字面量

const reg1 = /ac+b/;

我們來解讀一下,最外面是兩個斜槓(採用這種方法來創建的話斜槓是必須有的),斜槓裏面呢,就是模式組合(先甭管它是用來幹嘛的)。這種方法來創建正則表達式的方式,是最簡單,且當正則表達式保持不變時,其性能也是最好的。

2、調用RegExp對象的構造函數
就像字符串有String對象一樣,正則表達式也有一個RegExp對象。我們可以利用這個對象來創建正則表達式,就像下面這樣:

const reg1 = new RegExp("ac+b")

編寫正則表達式的模式

我們已經瞭解瞭如何創建正則表達式,也知道了正則表達式是模式匹配。接下來,按照套路,我們就應該來了解一下正則表達式的模式應該如何編寫。當你瞭解了正則表達式模式的編寫,那麼你自然也就能看得懂別人代碼裏的正則表達式是什麼意思啦。廢話不多數——下面就讓我們來揭開正則表達式的神祕面紗。

1、匹配模式的編寫——從檢測手機號碼開始

最簡單的,如果你想匹配這個 字符串中的“123”那麼只需要像這樣寫——/123/即可,如果你想匹配字符串中的”abc”,就可以寫成——/abc/。如果你想匹配到字符串中所有的“123”,那麼只需要在模式的後面加上標誌“g”即可——/123/g。“abc”也是一樣。

除了這些簡單的模式,更多的是一些很複雜的模式。我們可以通過正則表達式中的一些特殊字符的組合來實現。

在實際應用中,最常見的是用來檢測用戶輸入的是否是一個手機號碼,此時我們就可以使用正則表達式來進行匹配。

特殊字符\d是用來匹配字符串中的一個數字的。手機號碼有13位數字,
我們可以這樣來寫匹配模式,來檢測用戶輸入的是否是13位數字——/\d\d\d\d\d\d\d\d\d\d\d\d\d/。當然,這樣寫非常的繁瑣,那有沒有更簡單的方式來編寫呢?當然有!我們可以寫成這樣——/\d{13}/。
這樣是不是簡便多了。

特殊字符{n},其中n是整數,用來匹配前一個表達式剛好發生了n次。像前面的/\d{13|/表示匹配連續的13個數字。當然也可以和字母組合,比如/a{2}/,表示匹配連續的兩個a。

當然我們這樣檢測是不行的,當用戶輸入的是“ABC1234567891232dbz”時匹配也是成功的。因爲,字符串中確實有13個數字。所以我們需要來改良我們的模式。

我們要匹配的模式是要以數字開頭,有沒有辦法實現呢?當然!此時我們需要使用特殊字符——^。^用來匹配輸入的開始。我們把模式修改一下,變成這樣——/^\d{13}/。這樣,上面所說的字符串便不能被匹配到了。因爲它是以字母開頭,不是字符串開頭。那這樣就行了嗎?很遺憾這樣也不行,當用戶輸入的是“1234567891234abc”時,仍然符合匹配模式,確實是以數字開頭且連續13個數字。所以,我們需要進一步來改進我們的模式。

我們想要匹配以數字開始,且以數字結束,並且有13位數字。此時我們可以利用特殊字符——$$用來匹配輸入的結束。把模式修改城這樣——/^\d{13}$/。此時它的意思就是匹配以數字開始,且以數字結尾,並且有13位數字。那麼上面那幾種輸入的字符串,都不會被匹配。

到這一步,我們確保了用戶輸入的是13位數字,但並不是13位數字的隨機組合就是一個標準的手機號碼。因此,下面我們需要對用戶數入的這13 位數字進行檢測。

我們都知道,手機號碼的前兩位組合無非就是[13,15,17,18]中的一個,那麼我們如何把它運用到我們的模式中呢?

觀察這裏,手機號碼都是以1開頭,後面的第二位是[3,5,7,8]中的一個,其中3,5,7,8,是一個字符集,我們可以用“()”來把它給包圍起來,但是第二位數字只需要是它們四個當中的其中一個就可以了,那麼我們就使用“|”符。例如:x|y,就表示匹配x或者y。此時我們已經解決了最後一個問題。來讓我們看一看最終的模式長什麼樣——/^1(3|5|7|8|)\d{11}$/。

最終我們常用的匹配手機號的正則表達式就是這樣了。

下面是正則表達式的一些特殊字符的表格:

特殊字符

特殊字符 含義
{n} n 是一個正整數,匹配前面的一個字符剛好發生了n次,如果你想匹配字符串中連續的一串數字,那麼就可以使用——/\d{n}/。
{n,m} n,m都是整數,表示匹配前面的一個字符最少n次,最多m次。
^ 匹配輸入的開始。它可以這樣使用——/^\d{4}/,它匹配“1234abc”中的‘1234’,但是不會匹配‘ABC1234’中的‘1234’。
$ 匹配輸入的結束。它可以這樣使用——/\d{4}$/。它匹配“ABC1234”中的“1234”,不匹配“1234ABC”中的“1234”
+ 匹配前面一個表達式一次或者多次。例如:/\d+/。它會匹配“ABC12346”中的“12346”
* 匹配前面緊挨着的表達式0此或多次。例如,/bo*/會匹配 “A ghost boooooed” 中的 ‘booooo’ 和 “A bird warbled” 中的 ‘b’,但是在 “A goat grunted” 中將不會匹配任何東西。
? 匹配前面一個表達式0此或者1次,相當於{0,1}。

2、匹配一些特殊字符——從檢測電話號碼開始
有的時候我們可能還會遇到檢測電話號碼,像這樣的“800-692-7053”。電話號碼並不像手機號碼,它裏面除了數字之外還有特殊字符——“-”。當我們用正則表達式檢測時,該如何編寫呢?

想要匹配特殊字符,我們需要在它前面加上“\”對其進行轉義,將其變爲字面量。比如匹配字符串中的“*”。我們可以寫成/*/。此時“*”不再是一個特殊字符,而是變爲了一個普通的字面量。這樣就可以匹配到字符串中的特殊字符了。

知道了如何匹配特殊字符,那麼對於上述的電話號碼我們就可以編寫模式了——/^\d{3}-\d{3}-\d{4}$/。
如何還有其他的限制,那麼根據剛剛講述的編寫方法,對其進行改進即可。

下面是一些特殊字符的匹配表格:

字符 含義
\s 匹配一個空白字符,包括空格、製表符、換頁符和換行符
\t 匹配一個水平製表符
\f 匹配一個換頁符
\n 匹配一個換行符 (U+000A)
\r 匹配一個回車符 (U+000D)
\v 匹配一個垂直製表符 (U+000B)
\0 匹配 NULL (U+0000) 字符, 不要在這後面跟其它小數

最後

通過匹配手機號和電話號碼, 我們介紹了正則表達式中的一些特殊字符,但是,正則表達式中的特殊字符並不止這樣,下次,我們會通過匹配字符,來介紹剩下的特殊字符。祝大家食用愉快

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章