摘要：正則表達式使用單個字符串來描述匹配一系列匹配某個句法規(guī)則的字符串。接下來，是在手機正則里面已經(jīng)出現(xiàn)了。序列匹配而則匹配。分組與反向引用分組，又稱為子表達式。把正則表達式拆分成小表達式。

本文轉(zhuǎn)載自網(wǎng)絡(luò)。轉(zhuǎn)載編輯過程中，可能有遺漏或錯誤，請以原文為準。
原文作者：水墨寒湘
原文鏈接：https://juejin.im/post/582dfc...

正則表達式對于我來說一直像黑暗魔法一樣的存在。手機正則去網(wǎng)上搜，郵箱正則去網(wǎng)上搜，復雜點的看看文檔拼湊一下，再復雜只能厚著臉皮讓其他同事給寫一個,從來沒有系統(tǒng)的學習過。關(guān)于作者這幾句話，我是深有感觸，有幸暢游網(wǎng)絡(luò)看到這篇博文和對應的慕課網(wǎng)視頻，讓我收獲頗多，在此轉(zhuǎn)載，希望給更多需要的朋友帶來幫助。

視頻地址

了解正則表達式語法

在IDE中使用正則表達式

在javascript 中使用正則表達式處理字符串

正則表達式，又稱正規(guī)表示式、正規(guī)表示法、正規(guī)表達式、規(guī)則表達式、常規(guī)表示法（英語：Regular Expression，在代碼中常簡寫為regex、regexp或RE），計算機科學的一個概念。正則表達式使用單個字符串來描述、匹配一系列匹配某個句法規(guī)則的字符串。在很多文本編輯器里，正則表達式通常被用來檢索、替換那些匹配某個模式的文本。

通俗的講就是按照某種規(guī)則去匹配符合條件的字符串

輔助理解正則表達的在線工具 https://regexper.com/ 我們利用這個工具輔助理解，正則表達式。語法沒懂表著急，后面會有，這里只是學會用工具幫助我們學習。

/^1[34578][0-9]{9}$/

tips:以1開頭，第二位為3 4 5 7 9 其中一個，以9位（本身1次加重復8次）0-9數(shù)字結(jié)尾

/is/

tips: is前后都是單詞的邊界，比較晦澀難懂？感受下兩者的區(qū)別，b 會方道語法部分講解

/http:(//.+.jpg)/

看不懂的不要慌語法部分后面會有介紹，這里只是展示利用可視化的圖形幫助我們理解正則表達式，可以回來再看木有關(guān)系

正則表達式中括號用來分組，這個時候我們可以通過用$1來獲取 group#1的內(nèi)容

說下這個正則的意義，如果網(wǎng)站用了https，網(wǎng)站引用靜態(tài)資源也必須是https，否則報錯。如果寫成 // 會自動識別 http 或者 https

/^d{4}[/-]d{1,2}[/-]d{1,2}$/

這個正則比較復雜，畫符念咒的地方太多了，一一分析：

Start of line 是由^生效的表示以此開頭

對應結(jié)尾End of line 由$生效表示以此結(jié)尾

接著看digit 由 d 生效表示數(shù)字

3times 由{4} 生效表示重復4次，開始的時候有疑問，為什么不是 4times 。后來明白作者的用意，正則表達式是一個規(guī)則，用這個規(guī)則去從字符串開始匹配到結(jié)束（注意計算機讀字符串可是不會分行的，都是一個串，我們看到的多行，人家會認為是個 t ）這里設(shè)計好像小火車的軌道一直開到末尾。digit 傳過一次，3times表示再來三次循環(huán)，共4次，后面的once同理。 自己被自己啰嗦到了。

接下來，是 one of 在手機正則里面已經(jīng)出現(xiàn)了。表示什么都行。只要符合這兩個都讓通過。

好了這個正則解釋完了，接下來用它做什么呢？

我們可以驗證日期的合法性
結(jié)合URL分組替換所用到的分組特性，我們可以輕松寫出日期格式化的方法
改造下這個正則

/^(d{4})[/-](d{1,2})[/-](d{1,2})$/

輕松的可以拿到 group#1 #2 #3 的內(nèi)容，對應 $1 $2 $3

到現(xiàn)在已經(jīng)能結(jié)合圖形化工具看懂正則表達式表達式了，如果想自己寫，還要在正則語法上下點功夫

Javascript 通過內(nèi)置對象RegExp支持正則表達式，有兩種方法實例化RegExp對象

const reg =/is/g

const reg = new RegExp("is", "g")

修飾符與其他語法特殊，字面量方法聲名的時候放到//后，構(gòu)造函數(shù)聲明的時候，作為第二個參數(shù)傳入。整個正則表達式可以理解為正則表達式規(guī)則字符串+修飾符

g：global 執(zhí)行一個全局匹配

i：ignore case執(zhí)行一個不區(qū)分大小寫的匹配

m: multiple lines多行匹配

修飾符可以一起用

const reg =/is/gim

來說說他們有什么作用

有g(shù)和沒有g(shù)的區(qū)別

沒有g(shù)只替換了第一個，有g(shù) 所有的都換了

有i和沒有i的區(qū)別

有i忽略大小寫，沒有i嚴格區(qū)分大小寫

正則表達式由兩種基本字符組成：

原義字符

非打印字符

元字符 (* + ? $ ^ . | ( ) { } [ ])

原義字符

這個沒什么好解釋的，我們一直在舉例的 /is/ 匹配字符串"is"
將下一個字符標記為一個特殊字符、或一個原義字符、或一個向后引用、或一個八進制轉(zhuǎn)義符。例如，n”匹配字符“n”。“n”匹配一個換行符。序列“”匹配“”而“(”則匹配“(”。

非打印字符

非打印字符，以n為例

其他的在前端引用比較少，應該在后端處理文本文件的時候會用到

在前面的手機號正則例子?中，我們已經(jīng)使用過[] /^134578{9}$/
[34578]表示34578任意一個數(shù)字即可。在日期匹配與分組替換例子?中 /^d{4}[/-]d{2}[/-]d{2}$/ 表示符合 ／ - 都可以

表示不屬于此類

空格也不屬于，好多狗

正則表達式支持一定范圍規(guī)則比如 [a-z] [A-Z] [0-9] 可以連寫[a-z0-9] 如果你只是想匹配-在 范圍類最后加-即可。請看實例。

常用為了方便書寫

有了這些預定義類，寫一些正則就很方便了，比如我們希望匹配一個 ab+數(shù)字+任意字符 的字符串，就可以這樣寫了 /abd./

邊界顧名思義即定義匹配的邊界條件，上面基本都在前面的例子碰到了，這里演示下b與B 的區(qū)別

如果沒有量詞，要匹配4位數(shù)字這樣寫就可以/ffffdd/, 如果匹配50位100位呢？那不是要瘋掉了？
有了量詞，就可以這樣寫/d{100}/, 量詞的使用我們在手機號中使用過，表現(xiàn)在可視化中就是循環(huán)多少次。
湊一個上面都包含的實例/d?@d*@d+@d{10}@d{10,20}@d{10,}@d{0,10}/

正則表達式默認會匹配貪婪模式，什么是貪婪模式呢？如其名盡可能多的匹配。我們看個例子

/d{3,6}/

貪婪模式下，匹配的了最多的情況。
與貪婪對應就是懶惰模式，懶惰對應的就是匹配的盡可能少的情況。如何開啟懶惰模式？ 在量詞后面加?。繼續(xù)上面的例子

/d{3,6}?/

如果想知道，正則表達式是如何匹配量詞的，請看進階正則表達式文中有介紹，正則是如何回溯的。

分組，又稱為子表達式。把正則表達式拆分成小表達式。概念枯燥，說個例子為嘛用分組：

不分組

/abc{2}/

量詞僅作用到最后的c

分組

/(abc){2}/

注意這里 group #1
分組雖然和運算符() 很像，但是分組在正則表達式中，注意理解組的含義。經(jīng)常有人濫用分組
/^(http|https)/ 真的需要這樣么？其實 /^https?/就可以了，你正則寫的特別長的時候，會出現(xiàn)一堆沒用的結(jié)果，看著都頭疼吧。
分組往往和反向引用一起使用，別被概念嚇到：當一個正則表達式被分組后，每個分組自動被賦予一個組號，一左到右分別是 $1 $2…
再把之前的例子拿出來

/^(d{4})[/-](d{2})[/-](d{2})$/

輕松的可以拿到 group#1 #2 #3 的內(nèi)容，對應 $1 $2 $3

如果在反向引用中不想捕獲年該如何操作? 加上 ?:即可

/^(?:d{4})[/-](d{2})[/-](d{2})$/

這部分為進階部分—選看

正則表達式中有前瞻（Lookahead）和后顧（Lookbehind）的概念，這兩個術(shù)語非常形象的描述了正則引擎的匹配行為。需要注意一點，正則表達式中的前和后和我們一般理解的前后有點不同。一段文本，我們一般習慣把文本開頭的方向稱作“前面”，文本末尾方向稱為“后面”。但是對于正則表達式引擎來說，因為它是從文本頭部向尾部開始解析的（可以通過正則選項控制解析方向），因此對于文本尾部方向，稱為“前”，因為這個時候，正則引擎還沒走到那塊，而對文本頭部方向，則稱為“后”，因為正則引擎已經(jīng)走過了那一塊地方。

注意：后顧性能損耗比較大，js只支持前瞻（知乎上看到的，具體原因不詳）

上面的比較概念話，嘗試用大白話講講，就說皇上選妃吧，先行條件得是美女吧，長得“如花”那樣皇上可不要，漂亮這關(guān)過了，皇上想要這個美女也不行，皇室有規(guī)矩，必須是貴族血統(tǒng)。

那么“漂亮”就是正常的匹配，匹配到了，還得看看家室是不是貴族。"貴族"相當于前瞻條件

前瞻分兩種一種是正向前瞻(?=xxx), 另一種是負向前瞻(?!xxx)

是不是很簡單？那我們來玩?zhèn)€好玩的。
題目：如何將"123456"轉(zhuǎn)成貨幣帶逗號的。"123,456"。這個是很常規(guī)格式化金額的需求。

如果在沒有學習正則之前，我的思路是：

字符串轉(zhuǎn)數(shù)組

反轉(zhuǎn)數(shù)組

每隔三個添加個逗號

添加完了反轉(zhuǎn)數(shù)組

數(shù)組轉(zhuǎn)字符串

好累～～～
今天學習了正則，可以一步到位 "123456789".replace(/(d)(?=(?:d{3})+$)/g, "$1,")

如果你覺得此文對你有一定的幫助，可以點擊下方的【贊】收藏備用