JavaScript 正則表達(dá)式詳解
1. 正則表達(dá)式創(chuàng)建
JavaScript 有兩種方式創(chuàng)建正則表達(dá)式:
- 第一種:直接通過(guò)/正則表達(dá)式/寫出來(lái)
- 第二種:通過(guò)new RegExp('正則表達(dá)式')創(chuàng)建一個(gè)RegExp對(duì)象
const re1 = /ABC\-001/; const re2 = new RegExp('ABC\\-001'); re1; // /ABC\-001/ re2; // /ABC\-001/
注意,如果使用第二種寫法,因?yàn)樽址霓D(zhuǎn)義問(wèn)題,字符串的兩個(gè)\實(shí)際上是一個(gè)\。
2. 使用模式
2.1 使用簡(jiǎn)單模式
簡(jiǎn)單的模式是由找到的直接匹配所構(gòu)成的。比如,/abc/這個(gè)模式就匹配了在一個(gè)字符串中,僅僅字符 'abc' 同時(shí)出現(xiàn)并按照這個(gè)順序。在 "Hi, do you know your abc's?" 和 "The latest airplane designs evolved from slabcraft." 就會(huì)匹配成功。在上面的兩個(gè)實(shí)例中,匹配的是子字符串 'abc'。在字符串 "Grab crab" 中將不會(huì)被匹配,因?yàn)樗话魏蔚?'abc' 子字符串。
2.2 使用特殊字符
例如:模式/abc/匹配了一個(gè)單獨(dú)的 'a' 后面跟了零個(gè)或者多個(gè) 'b'(的意思是前面一項(xiàng)出現(xiàn)了零個(gè)或者多個(gè)),且后面跟著 'c' 的任何字符組合。在字符串 "s'scbbabbbbcdebc" 中,這個(gè)模式匹配了子字符串 "abbbbc"。
字符 | 含義 |
---|---|
\ | 匹配將依照下列規(guī)則: 在非特殊字符之前的反斜杠表示下一個(gè)字符是特殊的,不能從字面上解釋。例如,前面沒(méi)有''的'd'通常匹配小寫'd'。如果加了'',這個(gè)字符變成了一個(gè)特殊意義的字符,意思是匹配一個(gè)數(shù)字。 反斜杠也可以將其后的特殊字符,轉(zhuǎn)義為字面量。例如,模式 /a/ 代表會(huì)匹配 0 個(gè)或者多個(gè) a。相反,模式 /a*/ 將 '' 的特殊性移除,從而可以匹配像 "a*" 這樣的字符串。 使用 new RegExp("pattern") 的時(shí)候也不要忘記將 \ 進(jìn)行轉(zhuǎn)義,因?yàn)?\ 在字符串里面也是一個(gè)轉(zhuǎn)義字符。 |
^ | 匹配輸入的開始,例如,/^A/ 并不會(huì)匹配 "an A" 中的 'A',但是會(huì)匹配 "An E" 中的 'A'。 |
$ | 匹配輸入的結(jié)束。例如,/t$/ 并不會(huì)匹配 "eater" 中的 't',但是會(huì)匹配 "eat" 中的 't'。 |
* | 匹配前一個(gè)表達(dá)式0次或多次。等價(jià)于 {0,}。例如,/bo*/會(huì)匹配 "A ghost boooooed" 中的 'booooo' |
+ | 匹配前面一個(gè)表達(dá)式1次或者多次。等價(jià)于 {1,}。例如,/a+/匹配了在 "candy" 中的 'a',和在 "caaaaaaandy" 中所有的 'a'。 |
? | 匹配前面一個(gè)表達(dá)式0次或者1次。等價(jià)于 {0,1}。例如,/e?le?/ 匹配 "angel" 中的 'el',和 "angle" 中的 'le' 以及"oslo' 中的'l'。 如果緊跟在任何量詞 *、 +、? 或 {} 的后面,將會(huì)使量詞變?yōu)榉秦澙返模ㄆヅ浔M量少的字符),和缺省使用的貪婪模式(匹配盡可能多的字符)正好相反。 例如,對(duì) "123abc" 應(yīng)用 /\d+/ 將會(huì)返回 "123",如果使用 /\d+?/,那么就只會(huì)匹配到 "1"。 |
. | 匹配除換行符之外的任何單個(gè)字符。例如,/.n/將會(huì)匹配 "nay, an apple is on the tree" 中的 'an' 和 'on',但是不會(huì)匹配 'nay'。 |
x | y |
{n} | n是一個(gè)正整數(shù),匹配了前面一個(gè)字符剛好發(fā)生了n次。 比如,/a{2}/不會(huì)匹配“candy”中的'a',但是會(huì)匹配“caandy”中所有的a,以及“caaandy”中的前兩個(gè)'a'。 |
{n,m} | n 和 m 都是整數(shù)。匹配前面的字符至少n次,最多m次。如果 n 或者 m 的值是0, 這個(gè)值被忽略。例如,/a{1, 3}/ 并不匹配“cndy”中的任意字符,匹配“candy”中的a,匹配“caandy”中的前兩個(gè)a,也匹配“caaaaaaandy”中的前三個(gè)a。注意,當(dāng)匹配”caaaaaaandy“時(shí),匹配的值是“aaa”,即使原始的字符串中有更多的a。 |
[xyz] | 一個(gè)字符集合。匹配方括號(hào)中的任意字符,包括轉(zhuǎn)義序列。你可以使用破折號(hào)(-)來(lái)指定一個(gè)字符范圍。對(duì)于點(diǎn)(.)和星號(hào)(*)這樣的特殊符號(hào)在一個(gè)字符集中沒(méi)有特殊的意義。他們不必進(jìn)行轉(zhuǎn)義,不過(guò)轉(zhuǎn)義也是起作用的。 例如,[abcd] 和[a-d]是一樣的。他們都匹配"brisket"中的‘b',也都匹配“city”中的‘c'。/[a-z.]+/ 和/[\w.]+/與字符串“test.i.ng”匹配。 |
[^xyz] | 一個(gè)反向字符集。也就是說(shuō), 它匹配任何沒(méi)有包含在方括號(hào)中的字符。你可以使用破折號(hào)(-)來(lái)指定一個(gè)字符范圍。任何普通字符在這里都是起作用的。 |
\b | 匹配一個(gè)詞的邊界。一個(gè)詞的邊界就是一個(gè)詞不被另外一個(gè)“字”字符跟隨的位置或者沒(méi)有其他“字”字符在其前面的位置。注意,一個(gè)匹配的詞的邊界并不包含在匹配的內(nèi)容中。換句話說(shuō),一個(gè)匹配的詞的邊界的內(nèi)容的長(zhǎng)度是0。例如: /\bm/匹配“moon”中的‘m';/oo\b/并不匹配"moon"中的'oo',因?yàn)?oo'被一個(gè)“字”字符'n'緊跟著。/oon\b/匹配"moon"中的'oon',因?yàn)?oon'是這個(gè)字符串的結(jié)束部分。這樣他沒(méi)有被一個(gè)“字”字符緊跟著。 |
\d | 匹配一個(gè)數(shù)字。等價(jià)于[0-9]。例如, /\d/ 或者 /[0-9]/ 匹配"B2 is the suite number."中的'2'。 |
\D | 匹配一個(gè)非數(shù)字字符。等價(jià)于[^0-9]。例如, /\D/ 或者 /[^0-9]/ 匹配"B2 is the suite number."中的'B' 。 |
\f | 匹配一個(gè)換頁(yè)符 (U+000C)。 |
\n | 匹配一個(gè)換行符 (U+000A)。 |
\r | 匹配一個(gè)回車符 (U+000D)。 |
\s | 匹配一個(gè)空白字符,包括空格、制表符、換頁(yè)符和換行符。等價(jià)于[ \f\n\r\t\v\u00a0\u1680\u180e\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]。 例如, /\s\w*/ 匹配"foo bar."中的' bar'。 |
\S | 匹配一個(gè)非空白字符。等價(jià)于[^ \f\n\r\t\v\u00a0\u1680\u180e\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]。 例如, /\S\w*/ 匹配"foo bar."中的'foo'。 |
\t | 匹配一個(gè)水平制表符 (U+0009)。 |
\w | 匹配一個(gè)單字字符(字母、數(shù)字或者下劃線)。等價(jià)于[A-Za-z0-9_]。 例如, /\w/ 匹配 "apple," 中的 'a',"$5.28,"中的 '5' 和 "3D." 中的 '3'。 |
\W | 匹配一個(gè)非單字字符。 |
\n | 在正則表達(dá)式中,它返回最后的第n個(gè)子捕獲匹配的子字符串(捕獲的數(shù)目以左括號(hào)計(jì)數(shù))。 |
3. 應(yīng)用
3.1 切分字符串
用正則表達(dá)式切分字符串比用固定的字符更靈活,通常的切分代碼:
'a d c'.split(' '); // ['a', 'd', '', '', 'c']
上面方法無(wú)法識(shí)別連續(xù)的空格,改用正則表達(dá)式:
'a b c'.split(/\s+/); // ['a', 'b', 'c']
無(wú)論多少個(gè)空格都可以正常分割。再加入‘,':
'a,b, c d'.split(/[\s\,]+/); // ['a', 'b', 'c', 'd']
再加入;:
'a,b;; c d'.split(/[\s\,\;]+/); // ['a', 'b', 'c', 'd']
所以,可以用正則表達(dá)式來(lái)把不規(guī)范的輸入轉(zhuǎn)化成正確的數(shù)組。
3.2 分組
除了判斷是否匹配之外,正則表達(dá)式還可以提取子串,用()表示的就是要提取的分組(Group)。比如:
^(\d{4})-(\d{4,9})$分別定義了兩個(gè)組,可以直接從匹配的字符串中提取出區(qū)號(hào)和本地號(hào)碼:
var re = /^(\d{4})-(\d{4,9})$/; re.exec('0530-12306'); // ['010-12345', '010', '12345'] re.exec('0530 12306'); // null
exec()方法在匹配成功后,返回一個(gè)數(shù)組,第一個(gè)元素是正則表達(dá)式匹配到的整個(gè)字符串,后面的字符串表示匹配成功的子串。
exec()方法在匹配失敗時(shí)返回null。
3.3 貪婪匹配
注意,正則匹配默認(rèn)是貪婪匹配,也就是匹配盡可能多的字符。如下,匹配出數(shù)字后面的0:
var re = /^(\d+)(0*)$/; re.exec('102300'); // ['102300', '102300', '']
由于\d+采用貪婪匹配,直接把后面的0全部匹配了,結(jié)果0*只能匹配空字符串了。
必須讓\d+采用非貪婪匹配(也就是盡可能少匹配),才能把后面的0匹配出來(lái),加個(gè)?就可以讓\d+采用非貪婪匹配:
var re = /^(\d+?)(0*)$/; re.exec('102300'); // ['102300', '1023', '00']
3.4 正則表達(dá)式標(biāo)志
g 全局搜索。 i 不區(qū)分大小寫搜索。 m 多行搜索。 y 執(zhí)行“粘性”搜索,匹配從目標(biāo)字符串的當(dāng)前位置開始,可以使用y標(biāo)志。
3.5 test() 方法
test() 方法用于檢測(cè)一個(gè)字符串是否匹配某個(gè)模式,如果字符串中含有匹配的文本,則返回 true,否則返回 false。
var re = /^(\d{4})-(\d{4,9})$/; re.test('0530-12321'); // true re.test('0530-123ab'); // false re.test('0530 12321'); // false
4. 常用正則(參考)
驗(yàn)證Email地址:^\w+[-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$ 驗(yàn)證身份證號(hào)(15位或18位數(shù)字):^\d{15}|\d{}18$ 中國(guó)大陸手機(jī)號(hào)碼:1\d{10} 中國(guó)大陸固定電話號(hào)碼:(\d{4}-|\d{3}-)?(\d{8}|\d{7}) 中國(guó)大陸郵政編碼:[1-9]\d{5} IP地址:((2[0-4]\d|25[0-5]|[01]?\d\d?)\.){3}(2[0-4]\d|25[0-5]|[01]?\d\d?) 日期(年-月-日):(\d{4}|\d{2})-((1[0-2])|(0?[1-9]))-(([12][0-9])|(3[01])|(0?[1-9])) 日期(月/日/年):((1[0-2])|(0?[1-9]))/(([12][0-9])|(3[01])|(0?[1-9]))/(\d{4}|\d{2}) 驗(yàn)證數(shù)字:^[0-9]*$ 驗(yàn)證n位的數(shù)字:^\d{n}$ 驗(yàn)證至少n位數(shù)字:^\d{n,}$ 驗(yàn)證m-n位的數(shù)字:^\d{m,n}$ 驗(yàn)證零和非零開頭的數(shù)字:^(0|[1-9][0-9]*)$ 驗(yàn)證有1-3位小數(shù)的正實(shí)數(shù):^[0-9]+(.[0-9]{1,3})?$ 驗(yàn)證非零的正整數(shù):^\+?[1-9][0-9]*$ 驗(yàn)證非零的負(fù)整數(shù):^\-[1-9][0-9]*$ 驗(yàn)證非負(fù)整數(shù)(正整數(shù) + 0) ^\d+$ 驗(yàn)證非正整數(shù)(負(fù)整數(shù) + 0) ^((-\d+)|(0+))$ 驗(yàn)證長(zhǎng)度為3的字符:^.{3}$ 驗(yàn)證由26個(gè)英文字母組成的字符串:^[A-Za-z]+$ 驗(yàn)證由26個(gè)大寫英文字母組成的字符串:^[A-Z]+$ 驗(yàn)證由26個(gè)小寫英文字母組成的字符串:^[a-z]+$ 驗(yàn)證由數(shù)字和26個(gè)英文字母組成的字符串:^[A-Za-z0-9]+$
總結(jié)
本篇文章就到這里了,希望能夠給你帶來(lái)幫助,也希望您能夠多多關(guān)注腳本之家的更多內(nèi)容!
- 盤點(diǎn)javascript 正則表達(dá)式中 中括號(hào)的【坑】
- JS使用tofixed與round處理數(shù)據(jù)四舍五入的區(qū)別
- JS處理數(shù)據(jù)四舍五入(tofixed與round的區(qū)別詳解)
- javascript中toFixed()四舍五入使用方法詳解
- js正則表達(dá)式簡(jiǎn)單校驗(yàn)方法
- js用正則表達(dá)式篩選年月日的實(shí)例方法
- JS中toFixed()方法四舍五入的精度問(wèn)題詳解
- jmeter實(shí)現(xiàn)接口關(guān)聯(lián)的兩種方式(正則表達(dá)式提取器和json提取器)
- 在nest.js中通過(guò)正則表達(dá)式正確設(shè)置驗(yàn)證的方法
- jJavaScript中toFixed()和正則表達(dá)式的坑
相關(guān)文章
JavaScript使用indexOf獲得子字符串在字符串中位置的方法
這篇文章主要介紹了JavaScript使用indexOf獲得子字符串在字符串中位置的方法,涉及javascript中indexOf方法操作字符串的技巧,需要的朋友可以參考下2015-04-04uniapp開發(fā)APP之強(qiáng)制更新和熱更新的實(shí)現(xiàn)
使用uni-app開發(fā),可將代碼編譯到iOS、Android、微信小程序等多個(gè)平臺(tái),升級(jí)時(shí)也需考慮多平臺(tái)同步升級(jí),下面這篇文章主要給大家介紹了關(guān)于uniapp開發(fā)APP之強(qiáng)制更新和熱更新的相關(guān)資料,需要的朋友可以參考下2022-12-12JavaScript中document.forms[0]與getElementByName區(qū)別
在很多情況下JavaScript中document.forms[0]與getElementByName這兩種用法沒(méi)有區(qū)別,這片文章詳細(xì)的解釋了兩者的區(qū)別和用法,有興趣的朋友可以參考一下。2015-01-01JS中不應(yīng)該使用箭頭函數(shù)的四種情況詳解
箭頭函數(shù)給我們的工作帶來(lái)了極大的方便,但是它們有什么缺點(diǎn)呢?我們應(yīng)該一直使用箭頭函數(shù)嗎?我們應(yīng)該在哪些場(chǎng)景中停止使用箭頭函數(shù)?本文就來(lái)為大家詳細(xì)講講2022-07-07uniapp實(shí)現(xiàn)下拉刷新與上拉觸底加載功能的示例代碼
這篇文章主要記錄一下uniapp實(shí)現(xiàn)下拉刷新與上拉觸底加載功能的示例代碼,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2023-04-04JS自調(diào)用匿名函數(shù)具體實(shí)現(xiàn)
定義一個(gè)函數(shù)用做臨時(shí)的命名空間,在這個(gè)命名空間內(nèi)定義的變量都不會(huì)污染到全局命名空間,需要的朋友可以參考下2014-02-02