Javascript正則表達式入門(不定時更新)

原创 Lin_Grady 教程 javascript/jQuery 296阅读 2017-05-24 17:47:12 举报

PS:2018/03/27 優化文章格式,新增部分測試代碼

説起正則其實大家都會經常接觸到,前端小到校驗,大到插件隨處可見,簡單的方法也能實現需求,不過缺乏靈活性,一旦需要複雜化,沒有什麽比正則更加合適的技術了。這也算是程序員的一道檻了。
以下資料截圖都來源於JavaScript RegExp 對象

new RegExp(pattern, attributes)

表示正則表達式,它是對字符串執行模式匹配的強大工具。

參數作用
pattern字符串,指定了正則表達式的模式或其他正則表達式。
attributes修飾符。ECMAScript 標準化之前,不支持 m 屬性。如果 pattern 是正則表達式,而不是字符串,則必須省略該參數。

Javascript正則表達式入門(不定時更新)

返回值: 一個新的 RegExp 對象,具有指定的模式和標誌。如果參數 pattern 是正則表達式而不是字符串,那麼 RegExp() 構造函數將用與指定的 RegExp 相同的模式和標誌創建一個新的 RegExp 對象。
如果不用 new 運算符,而將 RegExp() 作為函數調用,那麼它的行為與用 new 運算符調用時一樣,只是當 pattern 是正則表達式時,它只返回 pattern,而不再創建一個新的 RegExp 對象。

拋出: SyntaxError - 如果 pattern 不是合法的正則表達式,或 attributes 含有 "g"、"i" 和 "m" 之外的字符,拋出該異常。
TypeError - 如果 pattern 是 RegExp 對象,但沒有省略 attributes 參數,拋出該異常。

首先得認識正則有哪些方法

RegExp 對象方法

RegExpObject.compile(regexp,modifier)

用於在腳本執行過程中編譯正則表達式,也可用於改變和重新編譯正則表達式(將正則表達式編譯為內部格式,從而更快地執行)。

參數作用
regexp正則表達式
modifier規定匹配的類型。"g" 用於全局匹配,"i" 用於區分大小寫,"gi" 用於全局區分大小寫的匹配。

實際上compile就是個修改編譯作用,不能直接用於匹配正則

性能提升還是挺明顯的

RegExpObject.exec(string)

用於檢索字符串中的正則表達式的匹配。

參數作用
string必需。要檢索的字符串。

返回值: 返回一個數組,其中存放匹配的結果。如果未找到匹配,則返回值為 null。
說明: 調用 RegExp 對象 r 的 test() 方法,並為它傳遞字符串 s,與這個表示式是等價的:r.exec(s) != null ---> r.test(s)。
重要事項: 如果在一個字符串中完成了一次模式匹配之後要開始檢索新的字符串,就必須手動地把 lastIndex 屬性重置為 0。
返回值: 請注意,無論 RegExpObject 是否是全局模式,exec() 都會把完整的細節添加到它返回的數組中。這就是 exec() 與 String.match() 的不同之處,後者在全局模式下返回的信息要少得多。因此我們可以這麼說,在循環中反覆地調用 exec() 方法是唯一一種獲得全局模式的完整模式匹配信息的方法。

圖片描述
index 屬性聲明的是匹配文本的位置。input 屬性則存放的是被檢索的字符串 string。

RegExpObject.test(string)

用於檢測一個字符串是否匹配某個模式.

參數作用
string必需。要檢索的字符串。

返回值: 如果字符串 string 中含有與 RegExpObject 匹配的文本,則返回 true,否則返回 false。
說明: 調用 RegExp 對象 r 的 test() 方法,並為它傳遞字符串 s,與這個表示式是等價的:r.exec(s) != null ---> r.test(s)。

支持正則表達式的 String 對象的方法

stringObject.search(regexp)

用於檢索字符串中指定的子字符串,或檢索與正則表達式相匹配的子字符串。

參數作用
regexp該參數可以是需要在 stringObject 中檢索的子串,也可以是需要檢索的 RegExp 對象。

返回值: stringObject 中第一個與 regexp 相匹配的子串的起始位置,如果沒有找到任何匹配的子串,則返回 -1。
說明: search() 方法不執行全局匹配,它將忽略標誌 g。它同時忽略 regexp 的 lastIndex 屬性,並且總是從字符串的開始進行檢索,這意味著它總是返回 stringObject 的第一個匹配的位置。

stringObject.match(searchvalue/regexp)

可在字符串內檢索指定的值,或找到一個或多個正則表達式的匹配。

參數作用
searchvalue必需。規定要檢索的字符串值。
regexp必需。規定要匹配的模式的 RegExp 對象。如果該參數不是 RegExp 對象,則需要首先把它傳遞給 RegExp 構造函數,將其轉換為 RegExp 對象。

返回值: 存放匹配結果的數組。該數組的內容依賴於 regexp 是否具有全局標誌 g。
說明: match() 方法將檢索字符串 stringObject,以找到一個或多個與 regexp 匹配的文本。這個方法的行為在很大程度上有賴於 regexp 是否具有標誌 g。
如果 regexp 沒有標誌 g,那麼 match() 方法就只能在 stringObject 中執行一次匹配。如果沒有找到任何匹配的文本, match() 將返回 null。否則,它將返回一個數組,其中存放了與它找到的匹配文本有關的信息。該數組的第 0 個元素存放的是匹配文本,而其餘的元素存放的是與正則表達式的子表達式匹配的文本。除了這些常規的數組元素之外,返回的數組還含有兩個對象屬性。index 屬性聲明的是匹配文本的起始字符在 stringObject 中的位置,input 屬性聲明的是對 stringObject 的引用。
如果 regexp 具有標誌 g,則 match() 方法將執行全局檢索,找到 stringObject 中的所有匹配子字符串。若沒有找到任何匹配的子串,則返回 null。如果找到了一個或多個匹配子串,則返回一個數組。不過全局匹配返回的數組的內容與前者大不相同,它的數組元素中存放的是 stringObject 中所有的匹配子串,而且也沒有 index 屬性或 input 屬性。
注意: 在全局檢索模式下,match() 即不提供與子表達式匹配的文本的信息,也不聲明每個匹配子串的位置。如果您需要這些全局檢索的信息,可以使用 RegExp.exec()。

stringObject.replace(regexp/substr,replacement)

用於在字符串中用一些字符替換另一些字符,或替換一個與正則表達式匹配的子串。

參數作用
regexp/substr必需。規定子字符串或要替換的模式的 RegExp 對象。請注意,如果該值是一個字符串,則將它作為要檢索的直接量文本模式,而不是首先被轉換為 RegExp 對象。
replacement必需。一個字符串值。規定了替換文本或生成替換文本的函數。

返回值: 一個新的字符串,是用 replacement 替換了 regexp 的第一次匹配或所有匹配之後得到的。

stringObject.split(separator,howmany)

用於把一個字符串分割成字符串數組。

參數作用
separator必需。字符串或正則表達式,從該參數指定的地方分割 stringObject。
howmany可選。該參數可指定返回的數組的最大長度。如果設置了該參數,返回的子串不會多於這個參數指定的數組。如果沒有設置該參數,整個字符串都會被分割,不考慮它的長度。

返回值: 一個字符串數組。該數組是通過在 separator 指定的邊界處將字符串 stringObject 分割成子串創建的。返回的數組中的字串不包括 separator 自身。
但是,如果 separator 是包含子表達式的正則表達式,那麼返回的數組中包括與這些子表達式匹配的字串(但不包括與整個正則表達式匹配的文本)。

方括號用於查找某個範圍內的字符:

Javascript正則表達式入門(不定時更新)

元字符(Metacharacter)是擁有特殊含義的字符:

Javascript正則表達式入門(不定時更新)
首先看看通用並且簡單的幾個元字符.

\b 和 \B元字符匹配單詞邊界與否意思是在單詞邊界匹配的位置,單詞字符後面或前面不與另一個單詞字符直接相鄰。請注意,匹配的單詞邊界並不包含在匹配中。換句話說,匹配的單詞邊界的長度為零。(不要與 [\b] 混淆。)

圖片描述

進制數我沒用,不太了解,下面都是指W

其他就字面意思,不解釋了.

量詞

Javascript正則表達式入門(不定時更新)

捕獲

參數作用
(n)匹配n,並捕獲文本到自動命名的組裡
(?:n)匹配 n但不獲取匹配結果,也就是說這是一個非獲取匹配,不進行存儲供以後使用。

正則表達式一個最重要的特性就是將匹配成功的模式的某部分進行存儲供以後使用這一能力。 對一個正則表達式模式或部分模式兩邊添加圓括號()可以把這部分表達式存儲到一個臨時緩衝區中。所捕獲的每個子匹配都按照在正則表達式模式中從左至右所遇到的內容按順序存儲。 存儲子匹配的緩衝區編號從1開始,連續編號至最大99個子表達式。 每個緩衝區都可以使用'\n'(或用'$n')訪問,其中n為1至99的阿拉伯數字,用來按順序標識特定緩衝區(子表達式)。

注意的是它只能匹配重複的規則

意思前面匹配到a後面只能也是a,哪怕它定製的規則的所有單詞
下面是或的簡短寫法

貪婪與懶惰模式

貪婪模式,它會儘可能匹配多的字符
懶惰模式,它會儘可能匹配少的字符
寫法區別就是貪婪模式後面加上?就變成懶惰模式了

正則匹配還有很多強大的功能位,只講到這裡一半是因為水平有限,平常用到也就這些.另一半是在javascript裏支持的功能也是有限,現階段講了也用不到就算了,

---------------------------------------------------實戰篇-----------------------------------------------------------------------------

現在開始來寫正題了.先寫個簡單的日期匹配練手,最基礎的數字匹配

常見的支付金額校驗,純數字大於0最多兩個小數

這個有點複雜,折騰很久,在網上找到好多的答案其實都是錯漏百出的,例如
/^\d*.?\d{0,2}$/: 它能匹配012這種不正常格式
/(^1-9?(.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9].0-9?$)/: 這種不用細看都知道不是合適答案,也就相當於分拆出每個可能,發揮不出正則的優勢,我都沒往下看了

逐步分析一下我自己寫的:
[1-9]\d:開頭衹能1-9,後面可不帶或帶多個數字
^(0|[1-9]\d
)?: 或者0開頭,也能省略開頭
(.\d{1,2})?$: 兩個小數可要可不要

之前還遇到一個面試題是替換字符串內的變量,如下

---------------------------------------------------尾聲-----------------------------------------------------------------------------
其實應該還有很多東西可以說,但是目前先熟悉掌握這些就夠了,過段時間我有時間再繼續寫些進階知識

评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复