最近在做一個(gè)小項(xiàng)目時(shí)用到了正則匹配，感覺(jué)正則挺好用的，所以打算抽時(shí)間來(lái)小小總結(jié)一下。
正則表達(dá)式是一種文本模式，包括普通字符（例如，a 到 z 之間的字母）和特殊字符（稱為“元字符”）。模式描述在搜索文本時(shí)要匹配的一個(gè)或多個(gè)字符串。RegExp 對(duì)象表示正則表達(dá)式，它是對(duì)字符串執(zhí)行模式匹配的強(qiáng)大工具。正則表達(dá)式是一種查找以及字符串替換操作。
新建正則表達(dá)式
方式一：直接量語(yǔ)法
var reg = /pattern/attributes
方式二：創(chuàng)建 RegExp 對(duì)象的語(yǔ)法
var reg = new RegExp(pattern, attributes);
參數(shù)說(shuō)明：
參數(shù) pattern 是一個(gè)字符串，指定了正則表達(dá)式的模式或其他正則表達(dá)式。
參數(shù) attributes 是一個(gè)可選的字符串，包含屬性 “g”、”i” 和 “m”，分別用于指定全局匹配、區(qū)分大小寫(xiě)的匹配和多行匹配。ECMAScript 標(biāo)準(zhǔn)化之前，不支持 m 屬性。如果 pattern 是正則表達(dá)式，而不是字符串，則必須省略該參數(shù)。
兩者區(qū)別在于：
1.采用直接量語(yǔ)法新建的正則表達(dá)式對(duì)象在代碼編譯時(shí)就會(huì)生成，是平常開(kāi)發(fā)中常用的方式；
2.采用構(gòu)造函數(shù)生成的正則對(duì)象要在代碼運(yùn)行時(shí)生成。
正則表達(dá)式使用：
正則對(duì)象的方法是指這樣使用的： RegExp對(duì)象.方法(字符串)
字符串對(duì)象的方法是這樣使用：字符串.方法(RegExp對(duì)象)
正則對(duì)象的屬性和方法
屬性
ignoreCase 返回布爾值，表示RegExp 對(duì)象是否具有標(biāo)志 i
global 返回布爾值，表示RegExp對(duì)象是否具有標(biāo)志g
multiline 返回布爾值，表示RegExp 對(duì)象是否具有標(biāo)志 m。
lastIndex 一個(gè)整數(shù)，標(biāo)識(shí)開(kāi)始下一次匹配的字符位置
source 返回正則表達(dá)式的源文本（不包括反斜杠）
i 執(zhí)行對(duì)大小寫(xiě)不敏感的匹配
g 執(zhí)行全局匹配（查找所有匹配而非在找到第一個(gè)匹配后停止）。
m 執(zhí)行多行匹配
正則表達(dá)式作用
通常用于兩種任務(wù)：
1.驗(yàn)證
用于驗(yàn)證時(shí)，通常需要在前后分別加上^和$，以匹配整個(gè)待驗(yàn)證字符串；
2.搜索替換
搜索/替換時(shí)是否加上此限定則根據(jù)搜索的要求而定，此外，也有可能要在前后加上/b而不是^和$
字符類匹配
[…] 查找方括號(hào)之間的任何字符
[^…] 查找任何不在方括號(hào)之間的字符
[a-z] 查找任何從小寫(xiě) a 到小寫(xiě) z 的字符
[A-Z] 查找任何從大寫(xiě) A 到大寫(xiě) Z 的字符
[A-z] 查找任何從大寫(xiě) A 到小寫(xiě) z 的字符
. 查找單個(gè)字符，除了換行和行結(jié)束符
/w 查找單詞字符，等價(jià)于[a-zA-Z0-9]
/W 查找非單詞字符，等價(jià)于[^a-zA-Z0-9]
/s 查找空白字符
/S 查找非空白字符
/d 查找數(shù)字，等價(jià)于[0-9]
/D 查找非數(shù)字字符，等價(jià)于[^0-9]
/b 匹配單詞邊界
/r 查找回車(chē)符
/t 查找制表符
/0 查找 NULL 字符
/n 查找換行符
重復(fù)字符匹配
{n,m} 匹配前一項(xiàng)至少n次，但不能超過(guò)m次
{n,} 匹配前一項(xiàng)n次或更多次
{n} 匹配前一項(xiàng)n次
n？ 匹配前一項(xiàng)0次或者1次，也就是說(shuō)前一項(xiàng)是可選的，等價(jià)于{0，1}
n+ 匹配前一項(xiàng)1次或多次，等價(jià)于{1，}
n* 匹配前一項(xiàng)0次或多次，等價(jià)于{0，}
n$ 匹配任何結(jié)尾為 n 的字符串
^n 匹配任何開(kāi)頭為 n 的字符串
?=n 匹配任何其后緊接指定字符串 n 的字符串
?!n 匹配任何其后沒(méi)有緊接指定字符串 n 的字符串
匹配特定數(shù)字
^[1-9]/d*$ 匹配正整數(shù)
^-[1-9]/d*$ 匹配負(fù)整數(shù)
^-?[0-9]/d*$ 匹配整數(shù)
^[1-9]/d*|0$ 匹配非負(fù)整數(shù)（正整數(shù) + 0）
^-[1-9]/d*|0$ 匹配非正整數(shù)（負(fù)整數(shù) + 0）
^[1-9]/d*./d*|0./d*[1-9]/d*$ 匹配正浮點(diǎn)數(shù)
^-([1-9]/d*./d*|0./d*[1-9]/d*)$ 匹配負(fù)浮點(diǎn)數(shù)
^-?([1-9]/d*./d*|0./d*[1-9]/d*|0?.0+|0)$ 匹配浮點(diǎn)數(shù)
^[1-9]/d*./d*|0./d*[1-9]/d*|0?.0+|0$ 匹配非負(fù)浮點(diǎn)數(shù)（正浮點(diǎn)數(shù) + 0）
^(-([1-9]/d*./d*|0./d*[1-9]/d*))|0?.0+|0$ 匹配非正浮點(diǎn)數(shù)（負(fù)浮點(diǎn)數(shù) + 0）
匹配特定字符串
^[A-Za-z]+$ 匹配由26個(gè)英文字母組成的字符串
^[A-Z]+$ 匹配由26個(gè)英文字母的大寫(xiě)組成的字符串
^[a-z]+$ 匹配由26個(gè)英文字母的小寫(xiě)組成的字符串
^[A-Za-z0-9]+$ 匹配由數(shù)字和26個(gè)英文字母組成的字符串
^/w+$ 匹配由數(shù)字、26個(gè)英文字母或者下劃線組成的字符串
方法
test方法
檢索字符串中指定的值。返回 true 或 false。
如果字符串 string 中含有與 RegExpObject 匹配的文本，則返回 true，否則返回 false。
Demo1:
如果正則表達(dá)式帶有g(shù)修飾符，則每一次test方法都從上一次匹配結(jié)束的位置開(kāi)始匹配。
使用了g修飾符的正則表達(dá)式，表示要記錄每一次搜索的位置，接著使用test方法，每次開(kāi)始搜索的位置都是上一次匹配的后一個(gè)位置。
<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>test方法</title></head><body> <script type="text/javascript"> var reg = /abc/g; var str = "123abc456abc"; console.log(reg.lastIndex);//0 console.log(reg.test(str));//true console.log(reg.lastIndex);//6 console.log(reg.test(str));//true console.log(reg.lastIndex);//12 console.log(reg.test(str));//false </script></body></html>
Demo2:
如果正則表達(dá)式是一個(gè)空字符串，則會(huì)匹配所有的字符串，但需要使用new RegExp()方式
<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>test方法</title></head><body> <script type="text/javascript"> console.log(new RegExp('').test('abc'));//true console.log(/''/.test('abc'));//false console.log(/''/.test("''"));//true </script></body></html>exec方法
exec() 方法用于檢索字符串中的正則表達(dá)式的匹配。
返回一個(gè)數(shù)組，其中存放匹配的結(jié)果。如果未找到匹配，則返回值為 null。
Demo1:
<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>exec方法</title></head><body> <script type="text/javascript"> var str = "xyz"; var reg1 = /x/; var reg2 = /a/; var res1 = reg1.exec(str); var res2 = reg2.exec(str); console.log(res1);//["x", index: 0, input: "xyz"] console.log(res2);//null </script></body></html>
Demo2:
如果正則表達(dá)式包含圓括號(hào)，則返回的數(shù)組會(huì)包括多個(gè)元素。首先是整個(gè)匹配成功的結(jié)果，后面是圓括號(hào)里匹配成功的結(jié)果，如果有多個(gè)圓括號(hào)，他們的匹配成功的結(jié)果都會(huì)成為數(shù)組元素
<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>exec方法2</title></head><body> <script type="text/javascript"> var str = 'abcdabc'; var reg = /(a)b(c)/; var res = reg.exec(str); console.log(res);//["abc", "a", "c", index: 0, input: "abcdabc"] </script></body></html>
對(duì)于調(diào)用exec方法后返回的數(shù)組具有以下兩個(gè)屬性：
input 整個(gè)原待匹配的字符串
index 整個(gè)模式匹配成功的開(kāi)始位置
支持正則表達(dá)式的 String 對(duì)象的方法
search方法
search() 方法用于檢索字符串中指定的子字符串，或檢索與正則表達(dá)式相匹配的子字符串。
返回值： stringObject 中第一個(gè)與 regexp 相匹配的子串的起始位置。
注釋：如果沒(méi)有找到任何匹配的子串，則返回 -1。
search() 方法不執(zhí)行全局匹配，它將忽略標(biāo)志 g。它同時(shí)忽略 regexp 的 lastIndex 屬性，并且總是從字符串的開(kāi)始進(jìn)行檢索，這意味著它總是返回 stringObject 的第一個(gè)匹配的位置。
Demo:
<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>search方法</title></head><body> <script type="text/javascript"> var str = "abcdcef"; console.log(str.search(/c/g));//2 </script></body></html>
match方法
match() 方法可在字符串內(nèi)檢索指定的值，或找到一個(gè)或多個(gè)正則表達(dá)式的匹配。該方法類似 indexOf() 和 lastIndexOf()，但是它返回指定的值，而不是字符串的位置。
字符串對(duì)象的match方法與正則對(duì)象的exec方法比較類似：
但是如果正則表達(dá)式帶有g(shù)修飾符，那么match方法與exec方法就有差別了:
可以看到match返回了所有成功匹配的結(jié)果，但是exec方法只返回了一個(gè)。
Demo:
<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>match方法</title></head><body> <script type="text/javascript"> var str = "abcd"; var reg1 = /a/; var reg2 = /x/; console.log(str.match(reg1));//["a", index: 0, input: "abcd"] console.log(str.match(reg2));//null var str = "abcdabc"; var reg = /a/g; console.log(str.match(reg));//["a", "a"] console.log(reg.exec(str));//["a", index: 0, input: "abcdabc"] </script></body></html>
replace方法
replace() 方法用于在字符串中用一些字符替換另一些字符，或替換一個(gè)與正則表達(dá)式匹配的子串。
返回值：一個(gè)新的字符串，是用 replacement 替換了 regexp 的第一次匹配或所有匹配之后得到的。
字符串 stringObject 的 replace() 方法執(zhí)行的是查找并替換的操作。它將在 stringObject 中查找與 regexp 相匹配的子字符串，然后用 replacement 來(lái)替換這些子串。如果 regexp 具有全局標(biāo)志 g，那么 replace() 方法將替換所有匹配的子串。否則，它只替換第一個(gè)匹配子串。
Demo:
<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>replace方法</title></head><body> <script type="text/javascript"> var str = "xxx"; console.log(str.replace('x','y'));//yxx console.log(str.replace(/x/,'y'));//yxx console.log(str.replace(/x/g,'y'));//yyy </script></body></html>replace方法中特殊字符替換
Demo:
<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>replace中的特殊字符替換</title></head><body> <script type="text/javascript"> //用子表達(dá)式替換：$1和$2 //正則表達(dá)式中()就是一個(gè)子表達(dá)式，$1對(duì)應(yīng)是第一個(gè)表達(dá)式的內(nèi)容，即java，$2為script var str = "javascript"; console.log(str.replace(/(java)(script)/,'$2$1')); //輸出：scriptjava //$& 為正則表達(dá)式匹配的字符串 //正則表達(dá)式通過(guò)直接量java來(lái)匹配，匹配結(jié)果為java，則 $&的值為java，然后用字符串$&-來(lái)替換匹配的字符串 var str1 = "javascript"; console.log(str1.replace(/java/,'$&-')); //輸出：java-script var str2 = "javascript"; // $`為匹配子串a(chǎn)va的左側(cè)文本，則為j console.log(str2.replace(/ava/,"$`")); //輸出：jjscript // $'為匹配子串a(chǎn)va的右側(cè)文本，則為script console.log(str2.replace(/ava/,"$'")); //輸出：jscriptscript // $$為直接量符號(hào)，即插入一個(gè)$符號(hào) console.log(str2.replace(/ava/,"$$"));//輸出：j$script </script></body></html>
replace的參數(shù)replacement是函數(shù)
match 為匹配整個(gè)字符串，即：xyz45678%$&^
a1 為第一個(gè)子表達(dá)式，([^/d]*)，匹配0個(gè)或多個(gè)非數(shù)字的字符，即:xyz
a2 為第二個(gè)子表達(dá)式,(/d*)，匹配0個(gè)或多個(gè)的數(shù)字，即：45678
a3 為第三個(gè)子表達(dá)式，([^/w]*)，匹配0個(gè)或匹配任何非單詞字符。等價(jià)于 [^A-Za-z0-9_]，即 %$&^
index為模式匹配出現(xiàn)的位置，從第一個(gè)字符已經(jīng)匹配成功，則位置為0
string為字符串本身，即 xyz45678%$&^
Demo:
<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>replace的參數(shù)replacement是函數(shù)</title></head><body> <script type="text/javascript">function replacer(match, a1, a2, a3, index, string) { return [a1, a2, a3].join(' ~ ');} var str = 'xyz45678%$&^'; var reg = /([^/d]*)(/d*)([^/w]*)/var res = str.replace(reg, replacer); console.log(res);//xyz ~ 45678 ~ %$&^ </script></body></html>split方法
split(‘字符串的分割正則','返回?cái)?shù)組的最大成員數(shù)')；返回分割后各部分組成的數(shù)組
Demo:
<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>split方法</title></head><body> <script type="text/javascript"> var str = 'a,b , c,d'; var res = str.split(",");//以逗號(hào)來(lái)分割字符串 console.log(res);//["a", "b ", " c", "d"] var str1 = 'a,b , c,,d'; var res1 = str1.split(/,*/);//以0或多個(gè)逗號(hào)來(lái)分割字符串 console.log(res1);//["a", "b", " ", " ", "c", "d"] var str2 = 'a, b,c, d'; var res2 = str2.split(/, */);//以0或?qū)€(gè)逗號(hào)空格來(lái)分割字符串 console.log(res2);//["a", "b", "c", "d"] var str3 = 'a, b,c, d'; var res3 = str3.split(/, */,2);//以0或?qū)€(gè)逗號(hào)空格來(lái)分割字符串，同時(shí)限制返回?cái)?shù)組中最多有兩項(xiàng) console.log(res3);//["a", "b"] </script></body></html>可以變換正則的匹配規(guī)則來(lái)分割字符串。
下面正則的匹配規(guī)則是以0或多個(gè)x來(lái)進(jìn)行分割，如果加上括號(hào)則括號(hào)匹配的部分也就是分割規(guī)則也會(huì)作為數(shù)組成員返回。
Demo2:
<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>split方法2</title></head><body> <script type="text/javascript"> var str = "x@@xx@xx@@"; var res = str.split(/x*/);//以0或者對(duì)個(gè)x為分隔符 console.log(res);//["", "@", "@", "@", "@", "@"] var res1 = str.split(/(x*)/);//如果加上括號(hào)則括號(hào)匹配的部分也就是分割規(guī)則也會(huì)作為數(shù)組成員返回 console.log(res1);//["", "x", "@", "", "@", "xx", "@", "xx", "@", "", "@"] </script></body></html>
正則表達(dá)式的一些應(yīng)用
1.字符串中出現(xiàn)次數(shù)最多的字符
var re = /(/w)/1+/g;
(/w)外面的圓括號(hào)表示分組,/1表示重復(fù)第一分組中的內(nèi)容 ，/1+表示 /w匹配到的字符重復(fù)n次，后面的g表示執(zhí)行全部替換
str.replace的第二個(gè)參數(shù)是個(gè)函數(shù),參數(shù)a表示整個(gè)匹配到的字符串，b表示第一捕獲分組也就是出現(xiàn)重復(fù)的單個(gè)字符 ，將a.length 與已經(jīng)記錄 過(guò)的最多重復(fù)num比較，如果a.length 更大，就將它賦值給num,用value記錄重復(fù)字符 b，這個(gè)函數(shù)返回的是替換文本，但這里沒(méi)有返回值，也就是說(shuō)替換 為空，每次替換這個(gè)函數(shù)都被執(zhí)行
<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>字符串中出現(xiàn)次數(shù)最多的字符</title></head><body><script type="text/javascript">var str = 'mmmmmmmmaaammmmmmmmmbbbbsccc';function most(str) { var arr = str.split(''); str = arr.sort().join('');//將字符串按單個(gè)字符分割，然后排序組合，經(jīng)過(guò)這一步，相同的字符就會(huì)排列到一起 var reg = /(/w)/1+/g; var num = 0; var value = ''; str.replace(reg, function (a,b) { // console.log(a); if (num<a.length) { num = a.length; value = b; } }); return '出現(xiàn)次數(shù)最多的字符是' + value + '出現(xiàn)了' + num + '次';}console.log(most(str)); </script></body></html>2.從url中提取子域名
<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>從url中提取子域名</title></head><body> <script type="text/javascript"> var url = "http://www.abc.com"; var reg = /[^.]+/;//匹配除了.之外的其他字符 var res = reg.exec(url)[0].substr(7); console.log(reg.exec(url));//["http://www", index: 0, input: "http://www.abc.com"] console.log(res);//www </script></body></html>
3.給字符串加千分符
<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>給字符串加千分符</title></head><body> <script type="text/javascript"> var str = "12345678912312"; function fn(str){ var reg = /(?=(?!b)(/d{3})+$)/g; return str.replace(reg,','); } var res = fn(str); console.log(res);//12,345,678,912,312 </script></body></html>常用的正則表達(dá)式
匹配國(guó)內(nèi)電話號(hào)碼：/d{3}-/d{8}|/d{4}-/d{7}
如 0511-4405222 或 021-87888822
匹配QQ號(hào)：[1-9][0-9]{4,}
從10000開(kāi)始
郵政編碼：[1-9]/d{5}(?!/d)
郵政編碼為6位數(shù)字
匹配身份證：/^(/d{14}|/d{17})(/d|[xX])$/
匹配規(guī)則：身份證號(hào)碼有15位或者18位，其中最后一位可能是X，其他全是數(shù)字
匹配ip地址：/d+./d+./d+./d+
匹配帳號(hào)是否合法(字母開(kāi)頭，允許5-16字節(jié)，允許字母數(shù)字下劃線)：^[a-zA-Z][a-zA-Z0-9_]{4,15}$ 表單驗(yàn)證時(shí)很實(shí)用
匹配中文字符： /[/u4E00-/u9FA5/uf900-/ufa2d]/
使用 Unicode，必須使用/u開(kāi)頭，接著是字符編碼的四位16進(jìn)制表現(xiàn)形式
匹配Email地址：
/^([a-zA-Z_0-9-])+@([a-zA-Z_0-9-])+(.[a-zA-Z_0-9-])+$/
郵箱的規(guī)則是: 由3部分組成
由1個(gè)或者多個(gè)字母數(shù)字下劃線和杠 + @ + 1個(gè)或者多個(gè)字母數(shù)字下劃線和杠 + . + 1個(gè)或者多個(gè)字母數(shù)字下劃線和杠
匹配網(wǎng)址URL：[a-zA-z]+://[^/s]*
判斷字符串是不是由數(shù)字組成: /^/d*$/
限制文本框只能輸入數(shù)字和小數(shù)點(diǎn)(二位小數(shù)點(diǎn)):
/^/d*.?/d{0,2}$/
說(shuō)明：開(kāi)頭有0個(gè)或者多個(gè)數(shù)字，(?表示匹配前一項(xiàng)0次或者多次)中間有0個(gè)或者1個(gè)小數(shù)點(diǎn)，小數(shù)點(diǎn)后面有0個(gè)或者最多2個(gè)數(shù)字
用戶名正則: /^[/u4E00-/u9FA5/uf900-/ufa2d/w]{4,16}$/
匹配規(guī)則：只能是中文，英文，數(shù)字，下劃線，4-16個(gè)字符
匹配中文字符正則：/[/u4E00-/u9FA5/uf900-/ufa2d]/
/w是 匹配英文，數(shù)字，下劃線
匹配英文地址:/^[a-zA-Z][.a-zA-Z/s,0-9]*?[a-zA-Z]+/匹配規(guī)則：包含點(diǎn)，字母，空格，逗號(hào)，數(shù)字，但是開(kāi)頭和結(jié)尾必須為字母分析：開(kāi)頭必須為字母可以這樣寫(xiě)/[a−zA−Z]/結(jié)尾必須為字母可以這樣寫(xiě)：/[a−zA−Z]+/
中間包含點(diǎn)，字母，空格，逗號(hào)，數(shù)字的正則：/[.a-zA-Z/s,0-9]*?/
外面的*號(hào)是0個(gè)或者多個(gè)，后面的問(wèn)號(hào)? 代表可有可無(wú);有就匹配，沒(méi)有就不匹配;
匹配價(jià)格:/^/d*(./d{0,2})?$/
匹配規(guī)則: 開(kāi)頭有0個(gè)或者多個(gè)數(shù)字，中間可能有一個(gè)小數(shù)點(diǎn)，后面有可能有0-2位小數(shù)
單詞的首字母大寫(xiě)://b(/w)|/s(/w)/g
驗(yàn)證日期格式:/^/d{4}[-//]/d{1,2}[-//]/d{1,2}$/
日期格式有2種 第一種是yyyy-mm-dd 或 yyyy/mm/dd
分析:月和天數(shù)可以有1位或者2位
以上就是小編為大家?guī)?lái)的js正則表達(dá)式學(xué)習(xí)和總結(jié)(必看篇)全部?jī)?nèi)容了，希望大家多多支持VEVB武林網(wǎng)~
新聞熱點(diǎn)
疑難解答
圖片精選
