摘要:用匹配的模式切割,第二個(gè)參數(shù)是限制返回結(jié)果的最大數(shù)量匹配規(guī)則字面量字符和元字符大部分字符在正則表達(dá)式中,就是字面的含義,比如匹配,匹配。它們叫做元字符,主要有以下幾個(gè)。相比之下,點(diǎn)號(hào)作為元字符是不包括換行符的。
1.概述
正則表達(dá)式(regular expression)是一種表達(dá)文本模式(即字符串結(jié)構(gòu))的方法。
創(chuàng)建方式有兩種方式:
一種是使用字面量,以斜杠表示開(kāi)始和結(jié)束。
var regex = /xyz/
另一種是使用RegExp構(gòu)造函數(shù)。
var regex = new RegExp("xyz");
它們的主要區(qū)別是,第一種方法在引擎編譯代碼時(shí),就會(huì)新建正則表達(dá)式,第二種方法在運(yùn)行時(shí)新建正則表達(dá)式,所以前者的效率較高。而且,前者比較便利和直觀,所以實(shí)際應(yīng)用中,基本上都采用字面量定義正則表達(dá)式。
2.實(shí)例屬性i:忽略大小寫(xiě)
m:多行模式
g:全局搜索
3.實(shí)例方法 3.1 RegExp.prototype.test()正則實(shí)例對(duì)象的test方法返回一個(gè)布爾值,表示當(dāng)前模式是否能匹配參數(shù)字符串。
/小智/.test("小智 終身學(xué)習(xí)執(zhí)行者") // true
reg.exec(str) 返回匹配結(jié)果數(shù)組,不匹配則返回null,每執(zhí)行一次exec就向后匹配一次
3.2 RegExp.prototype.exec()3.2.1 reg.exec(str) 返回匹配結(jié)果數(shù)組,不匹配則返回null,每執(zhí)行一次exec就向后匹配一次
var s = "_x_x"; var r1 = /x/; var r2 = /y/; r1.exec(s) // ["x"] r2.exec(s) // null
3.2.1.2如果表達(dá)式里有括號(hào)(),稱為組匹配,返回結(jié)果中,第一個(gè)是整體匹配結(jié)果,后面依次是每個(gè)括號(hào)匹配的結(jié)果
var s = "_x_x"; var r = /_(x)/; r.exec(s) // ["_x", "x"]
exec方法的返回?cái)?shù)組還包含以下兩個(gè)屬性:
input:整個(gè)原字符串。
index:整個(gè)模式匹配成功的開(kāi)始位置(從0開(kāi)始計(jì)數(shù))。
var r = /a(b+)a/; var arr = r.exec("_abbba_aba_"); arr // ["abbba", "bbb"] arr.index // 1 arr.input // "_abbba_aba_"
3.2.3 如果表達(dá)式中有g(shù)選項(xiàng)進(jìn)行全局搜索,則可以多次使用 exec,下次的匹配從上次的結(jié)果后開(kāi)始
var reg = /a/g; var str = "abc_abc_abc" var r1 = reg.exec(str); r1 // ["a"] r1.index // 0 reg.lastIndex // 1 var r2 = reg.exec(str); r2 // ["a"] r2.index // 4 reg.lastIndex // 5 var r3 = reg.exec(str); r3 // ["a"] r3.index // 8 reg.lastIndex // 9 var r4 = reg.exec(str); r4 // null reg.lastIndex // 04.字符串的實(shí)例方法 4.1 str.match(reg),與 reg.exec相似,但是,如果使用g選項(xiàng),則str.match一次性返回所有結(jié)果。
var s = "abba"; var r = /a/g; s.match(r) // ["a", "a"] r.exec(s) // ["a"]4.2 str.search(reg) ,返回匹配成功的第一個(gè)位置,如果沒(méi)有任何匹配,則返回-1。
"_x_x".search(/x/) // 14.3 str.replace(reg,newstr) ;
用第一個(gè)參數(shù)reg去匹配,用第二個(gè)參數(shù)newstr 去替換,正則表達(dá)式如果不加g修飾符,就替換第一個(gè)匹配成功的值,否則替換所有匹配成功的值。
"aaa".replace("a", "b") // "baa" "aaa".replace(/a/, "b") // "baa" "aaa".replace(/a/g, "b") // "bbb"4.4 str.split(reg[,maxLength]) 用匹配的模式切割,第二個(gè)參數(shù)是限制返回結(jié)果的最大數(shù)量 5. 匹配規(guī)則 5.1 字面量字符和元字符
大部分字符在正則表達(dá)式中,就是字面的含義,比如/a/匹配a,/b/匹配b。如果在正則表達(dá)式之中,某個(gè)字符只表示它字面的含義(就像前面的a和b),那么它們就叫做“字面量字符”(literal characters)。
除了字面量字符以外,還有一部分字符有特殊含義,不代表字面的意思。它們叫做“元字符”(metacharacters),主要有以下幾個(gè)。
(1) 點(diǎn)字符(.)
點(diǎn)字符(.)匹配除回車(chē)(r)、換行(n) 、行分隔符(u2028)和段分隔符(u2029)以外的所有字符。
/c.t/
上面代碼中,c.t匹配c和t之間包含任意一個(gè)字符的情況,只要這三個(gè)字符在同一行,比如cat、c2t、c-t等等,但是不匹配coot。
(2)位置字符
^ 表示字符串的開(kāi)始位置
$ 表示字符串的結(jié)束位置
// test必須出現(xiàn)在開(kāi)始位置 /^test/.test("test123") // true // test必須出現(xiàn)在結(jié)束位置 /test$/.test("new test") // true // 從開(kāi)始位置到結(jié)束位置只有test /^test$/.test("test") // true /^test$/.test("test test") // false
(3)選擇符(|)
豎線符號(hào)(|)在正則表達(dá)式中表示“或關(guān)系”(OR),即cat|dog表示匹配cat或dog。
/11|22/.test("911") // true
上面代碼中,正則表達(dá)式指定必須匹配11或22。
5.2 轉(zhuǎn)義符正則表達(dá)式中那些有特殊含義的元字符,如果要匹配它們本身,就需要在它們前面要加上反斜杠。比如要匹配+,就要寫(xiě)成+。
/1+1/.test("1+1") // false /1+1/.test("1+1") // true
正則表達(dá)式中,需要反斜杠轉(zhuǎn)義的,一共有12個(gè)字符:^、.、[、$、(、)、|、*、+、?、{和。需要特別注意的是,如果使用RegExp方法生成正則對(duì)象,轉(zhuǎn)義需要使用兩個(gè)斜杠,因?yàn)樽址畠?nèi)部會(huì)先轉(zhuǎn)義一次。
(new RegExp("1+1")).test("1+1") // false (new RegExp("1+1")).test("1+1") // true5.3 字符類
字符類(class)表示有一系列字符可供選擇,只要匹配其中一個(gè)就可以了。所有可供選擇的字符都放在方括號(hào)內(nèi),比如[xyz] 表示x、y、z之中任選一個(gè)匹配。
/[abc]/.test("hello world") // false /[abc]/.test("apple") // true
有兩個(gè)字符在字符類中有特殊含義。
(1)脫字符(^)
如果方括號(hào)內(nèi)的第一個(gè)字符是[^xyz]表示除了x、y、z之外都可以匹配:
/[^abc]/.test("hello world") // true /[^abc]/.test("bbc") // false
如果方括號(hào)內(nèi)沒(méi)有其他字符,即只有[^],就表示匹配一切字符,其中包括換行符。相比之下,點(diǎn)號(hào)作為元字符(.)是不包括換行符的。
var s = "Please yes make my day!"; s.match(/yes.*day/) // null s.match(/yes[^]*day/) // [ "yes make my day"]
上面代碼中,字符串s含有一個(gè)換行符,點(diǎn)號(hào)不包括換行符,所以第一個(gè)正則表達(dá)式匹配失敗;第二個(gè)正則表達(dá)式[^]包含一切字符,所以匹配成功。
(2)連字符(-)
某些情況下,對(duì)于連續(xù)序列的字符,連字符(-)用來(lái)提供簡(jiǎn)寫(xiě)形式,表示字符的連續(xù)范圍。比如,[abc]可以寫(xiě)成[a-c],[0123456789]可以寫(xiě)成[0-9],同理[A-Z]表示26個(gè)大寫(xiě)字母。
/a-z/.test("b") // false /[a-z]/.test("b") // true
以下都是合法的字符類簡(jiǎn)寫(xiě)形式。
[0-9.,] [0-9a-fA-F] [a-zA-Z0-9-] [1-31]
上面代碼中最后一個(gè)字符類[1-31],不代表1到31,只代表1到3。
另外,不要過(guò)分使用連字符,設(shè)定一個(gè)很大的范圍,否則很可能選中意料之外的字符。最典型的例子就是[A-z],表面上它是選中從大寫(xiě)的A到小寫(xiě)的z之間52個(gè)字母,但是由于在 ASCII 編碼之中,大寫(xiě)字母與小寫(xiě)字母之間還有其他字符,結(jié)果就會(huì)出現(xiàn)意料之外的結(jié)果。
/[A-z]/.test("") // true
上面代碼中,由于反斜杠("")的ASCII碼在大寫(xiě)字母與小寫(xiě)字母之間,結(jié)果會(huì)被選中。
5.4 預(yù)定義模式預(yù)定義模式指的是某些常見(jiàn)模式的簡(jiǎn)寫(xiě)方式。
d 匹配0-9之間的任一數(shù)字,相當(dāng)于[0-9]。
D 匹配所有0-9以外的字符,相當(dāng)于[^0-9]。
w 匹配任意的字母、數(shù)字和下劃線,相當(dāng)于[A-Za-z0-9_]。
W 除所有字母、數(shù)字和下劃線以外的字符,相當(dāng)于[^A-Za-z0-9_]。
s 匹配空格(包括換行符、制表符、空格符等),相等于[ vf]。
S 匹配非空格的字符,相當(dāng)于[^ vf]。
b 匹配詞的邊界。
B 匹配非詞邊界,即在詞的內(nèi)部。
// s 的例子 /sw*/.exec("hello world") // [" world"] // 的例子 /world/.test("hello world") // true /world/.test("hello-world") // true /world/.test("helloworld") // false // B 的例子 /Bworld/.test("hello-world") // false /Bworld/.test("helloworld") // true
通常,正則表達(dá)式遇到換行符(n)就會(huì)停止匹配。
var html = "Hello world!"; /.*/.exec(html)[0] // "Hello"
上面代碼中,字符串html包含一個(gè)換行符,結(jié)果點(diǎn)字符(.)不匹配換行符,導(dǎo)致匹配結(jié)果可能不符合原意。這時(shí)使用s字符類,就能包括換行符。
var html = "Hello world!"; /[Ss]*/.exec(html)[0] // "Hello world!"
上面代碼中,[Ss]指代一切字符。
5.5 重復(fù)類模式的精確匹配次數(shù),使用大括號(hào)({})表示。{n}表示恰好重復(fù)n次,{n,}表示至少重復(fù)n次,{n,m}表示重復(fù)不少于n次,不多于m次。
/lo{2}k/.test("look") // true /lo{2,5}k/.test("looook") // true
上面代碼中,第一個(gè)模式指定o連續(xù)出現(xiàn)2次,第二個(gè)模式指定o連續(xù)出現(xiàn)2次到5次之間。
5.6 量詞符*. ? 問(wèn)號(hào)表示某個(gè)模式出現(xiàn)0次或1次,等同于{0, 1}。
*. * 星號(hào)表示某個(gè)模式出現(xiàn)0次或多次,等同于{0,}。
*. + 加號(hào)表示某個(gè)模式出現(xiàn)1次或多次,等同于{1,}。
上一小節(jié)的三個(gè)量詞符,默認(rèn)情況下都是最大可能匹配,即匹配直到下一個(gè)字符不滿足匹配規(guī)則為止。這被稱為貪婪模式。
var s = "aaa"; s.match(/a+/) // ["aaa"]
上面代碼中,模式是/a+/,表示匹配1個(gè)a或多個(gè)a,那么到底會(huì)匹配幾個(gè)a呢?因?yàn)槟J(rèn)是貪婪模式,會(huì)一直匹配到字符a不出現(xiàn)為止,所以匹配結(jié)果是3個(gè)a。
如果想將貪婪模式改為非貪婪模式,可以在量詞符后面加一個(gè)問(wèn)號(hào)。
var s = "aaa"; s.match(/a+?/) // ["a"]
除了非貪婪模式的加號(hào),還有非貪婪模式的星號(hào)(*)和非貪婪模式的問(wèn)號(hào)(?)
+?:表示某個(gè)模式出現(xiàn)1次或多次,匹配時(shí)采用非貪婪模式。
*?:表示某個(gè)模式出現(xiàn)0次或多次,匹配時(shí)采用非貪婪模式。
??:表格某個(gè)模式出現(xiàn)0次或1次,匹配時(shí)采用非貪婪模式。
5.8 組匹配(1)概述
正則表達(dá)式的括號(hào)表示分組匹配,括號(hào)中的模式可以用來(lái)匹配分組的內(nèi)容。
/fred+/.test("fredd") // true /(fred)+/.test("fredfred") // true
上面代碼中,第一個(gè)模式?jīng)]有括號(hào),結(jié)果+只表示重復(fù)字母d,第二個(gè)模式有括號(hào),結(jié)果+就表示匹配fred這個(gè)詞。
下面是另外一個(gè)分組捕獲的例子。
var m = "abcabc".match(/(.)b(.)/); m // ["abc", "a", "c"]
上面代碼中,正則表達(dá)式/(.)b(.)/一共使用兩個(gè)括號(hào),第一個(gè)括號(hào)捕獲a,第二個(gè)括號(hào)捕獲c。
注意,使用組匹配時(shí),不宜同時(shí)使用g修飾符,否則match方法不會(huì)捕獲分組的內(nèi)容。
var m = "abcabc".match(/(.)b(.)/g); m // ["abc", "abc"]
正則表達(dá)式內(nèi)部,還可以用n引用括號(hào)匹配的內(nèi)容,n是從1開(kāi)始的自然數(shù),表示對(duì)應(yīng)順序的括號(hào)。
/(.)b(.)1b2/.test("abcabc") // true
上面的代碼中,1表示第一個(gè)括號(hào)匹配的內(nèi)容(即a),2表示第二個(gè)括號(hào)匹配的內(nèi)容(即c)。
(2)非捕獲組
(?:x)稱為非捕獲組(Non-capturing group),表示不返回該組匹配的內(nèi)容,即匹配的結(jié)果中不計(jì)入這個(gè)括號(hào)。
非捕獲組的作用請(qǐng)考慮這樣一個(gè)場(chǎng)景,假定需要匹配foo或者foofoo,正則表達(dá)式就應(yīng)該寫(xiě)成/(foo){1, 2}/,但是這樣會(huì)占用一個(gè)組匹配。這時(shí),就可以使用非捕獲組,將正則表達(dá)式改為/(?:foo){1, 2}/,它的作用與前一個(gè)正則是一樣的,但是不會(huì)多帶帶輸出括號(hào)內(nèi)部的內(nèi)容。
var m = "abc".match(/(?:.)b(.)/); m // ["abc", "c"]
上面代碼中的模式,一共使用了兩個(gè)括號(hào)。其中第一個(gè)括號(hào)是非捕獲組,所以最后返回的結(jié)果中沒(méi)有第一個(gè)括號(hào),只有第二個(gè)括號(hào)匹配的內(nèi)容。
(3)先行斷言
x(?=y)稱為先行斷言(Positive look-ahead),x只有在y前面才匹配,y不會(huì)被計(jì)入返回結(jié)果。比如,要匹配后面跟著百分號(hào)的數(shù)字,可以寫(xiě)成/d+(?=%)/。
“先行斷言”中,括號(hào)里的部分是不會(huì)返回的。
var m = "abc".match(/b(?=c)/); m // ["b"]
上面的代碼使用了先行斷言,b在c前面所以被匹配,但是括號(hào)對(duì)應(yīng)的c不會(huì)被返回。
(4)先行否定斷言
x(?!y)稱為先行否定斷言(Negative look-ahead),x只有不在y前面才匹配,y不會(huì)被計(jì)入返回結(jié)果。比如,要匹配后面跟的不是百分號(hào)的數(shù)字,就要寫(xiě)成/d+(?!%)/。
/d+(?!.)/.exec("3.14") // ["14"]
上面代碼中,正則表達(dá)式指定,只有不在小數(shù)點(diǎn)前面的數(shù)字才會(huì)被匹配,因此返回的結(jié)果就是14。
6. 實(shí)戰(zhàn) 6.1 消除字符串首尾兩端的空格var str = " #id div.class "; str.replace(/^s+|s+$/g, "") // "#id div.class"6.2 驗(yàn)證手機(jī)號(hào)碼
var reg = /1[24578]d{9}/; reg.test("154554568997"); //true reg.test("234554568997"); //false6.3 把手機(jī)號(hào)碼替換成 *
var reg = /1[24578]d{9}/; var str = "姓名:張三 手機(jī):18210999999 性別:男"; str.replace(reg, "***") //"姓名:張三 手機(jī):*** 性別:男"6.4 匹配網(wǎng)頁(yè)標(biāo)簽
var strHtlm = "小智小智6.5 替換敏感字222222@.qq.com小智小智"; var reg = /<(.+)>.+1>/; strHtlm.match(reg); // ["222222@.qq.com"]
let str = "中國(guó)共產(chǎn)黨中國(guó)人民解放軍中華人民共和國(guó)"; let r = str.replace(/中國(guó)|軍/g, input => { let t = ""; for (let i = 0; i6.6 千位分隔符 let str = "100002003232322"; let r = str.replace(/(d)(?=(?:d{3})+$)/g, "$1,"); console.log(r); //100,002,003,232,322參考鏈接https://developer.mozilla.org...
https://wangdoc.com/javascrip...
你的點(diǎn)贊是我持續(xù)分享好東西的動(dòng)力,歡迎點(diǎn)贊!
一個(gè)笨笨的碼農(nóng),我的世界只能終身學(xué)習(xí)!
更多內(nèi)容請(qǐng)關(guān)注公眾號(hào)《大遷世界》!
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://specialneedsforspecialkids.com/yun/98153.html
摘要:對(duì)前端來(lái)說(shuō),使用的場(chǎng)景不多,但是像微信端的對(duì)話系統(tǒng)的表情包,就使用到了一個(gè)特定的規(guī)則。我是一個(gè)前端,工作年了,現(xiàn)在失業(yè),想進(jìn)入騰訊工作,這是我的聯(lián)系方式這個(gè)正則雖 我發(fā)現(xiàn)有個(gè)別字符被這個(gè)編輯器給刷掉了,但是灰色區(qū)域顯示正常,以灰色區(qū)域代碼為準(zhǔn) 什么玩意? 在我剛開(kāi)始學(xué)習(xí)編程的時(shí)候,就聽(tīng)過(guò)正則了,也聽(tīng)說(shuō)正則很牛逼,懂正則的更牛逼。但是苦于沒(méi)有人指點(diǎn),也沒(méi)有使用正則的場(chǎng)景,自己看教程又懵逼...
摘要:本文接上篇,基礎(chǔ)部分相對(duì)薄弱的同學(xué)請(qǐng)移步正則表達(dá)式學(xué)習(xí)筆記一理論基礎(chǔ)。正則表達(dá)式標(biāo)志符全局匹配,即找到所有匹配的。方法返回結(jié)果的格式不一致問(wèn)題這個(gè)問(wèn)題上文正則表達(dá)式學(xué)習(xí)筆記一理論基礎(chǔ)也有體現(xiàn),這里再單獨(dú)拿來(lái)說(shuō)一說(shuō),以加深記憶。 showImg(https://segmentfault.com/img/remote/1460000014261596?w=600&h=338); 本文接上篇...
摘要:正則表達(dá)式使用單個(gè)字符串來(lái)描述匹配一系列匹配某個(gè)句法規(guī)則的字符串。接下來(lái),是在手機(jī)正則里面已經(jīng)出現(xiàn)了。序列匹配而則匹配。分組與反向引用分組,又稱為子表達(dá)式。把正則表達(dá)式拆分成小表達(dá)式。 本文轉(zhuǎn)載自網(wǎng)絡(luò)。轉(zhuǎn)載編輯過(guò)程中,可能有遺漏或錯(cuò)誤,請(qǐng)以原文為準(zhǔn)。原文作者:水墨寒湘原文鏈接:https://juejin.im/post/582dfc... 正則表達(dá)式對(duì)于我來(lái)說(shuō)一直像黑暗魔法一樣的存...
摘要:詳解十大常用設(shè)計(jì)模式力薦深度好文深入理解大設(shè)計(jì)模式收集各種疑難雜癥的問(wèn)題集錦關(guān)于,工作和學(xué)習(xí)過(guò)程中遇到過(guò)許多問(wèn)題,也解答過(guò)許多別人的問(wèn)題。介紹了的內(nèi)存管理。 延遲加載 (Lazyload) 三種實(shí)現(xiàn)方式 延遲加載也稱為惰性加載,即在長(zhǎng)網(wǎng)頁(yè)中延遲加載圖像。用戶滾動(dòng)到它們之前,視口外的圖像不會(huì)加載。本文詳細(xì)介紹了三種延遲加載的實(shí)現(xiàn)方式。 詳解 Javascript十大常用設(shè)計(jì)模式 力薦~ ...
閱讀 2651·2019-08-30 15:53
閱讀 2876·2019-08-29 16:20
閱讀 1084·2019-08-29 15:10
閱讀 1022·2019-08-26 10:58
閱讀 2195·2019-08-26 10:49
閱讀 633·2019-08-26 10:21
閱讀 705·2019-08-23 18:30
閱讀 1638·2019-08-23 15:58