淺析JavaScript正則表達式

1.正則表達式的定義

  正則表達式是一個描述字符模式的對象。JavaScript的RegExp類表示正則表達式,String和RegExp都定義了方法,後者使用正則表達式進行強大的模式匹配和文本檢索與替換功能,JavaScript的正則表達式語法是Perl5的正則表達式語法的大型子集javascript

1.直接量定義(perl風格,本人較習慣用直接量):var reg = /exp/attributesjava

  var pattern = /ccy$/;//匹配以ccy結尾的字符串;git

注:同一段代碼所表示的正則表達式每次運行時直接量會轉換成不一樣的RegExp對象
2.RegExp對象定義(js風格):var reg = new RegExp(exp, attributes);正則表達式

  var pattern = new RegExp("ccy$");;//匹配以ccy結尾的字符串;npm

2.直接量字符

  正則表達式中的全部字母和數字都是按照字面含義進行匹配的。JavaScript正則表達式語法也支持非字母的字符匹配,這些字符須要經過反斜槓做爲前綴進行轉義。vim

字母和數字字符 自身
\o NUL字符
\t 製表符
\n 換行符
\v 垂直製表符
\f 換頁符
\r 回車符
\xnn 由十六進制nn指定的拉丁字符
\uxxxx 由十六進制xxxx指定的Unicode字符
\cX 控制符^X

 demo:
/\n/.test('\nccy');//true 匹配 \nccy
/\n/.test('\\nccy');//false 不匹配 \ccy
/\n/.test('\\\nccy');//true 匹配 \\nccy
數組


3.字符匹配

字符 匹配
[...] 方括號內的任意字符
[^...] 不在方括號內的任意字符
. 除換行符和其餘Unicode行終止符以外的任意字符
\w 任何ASCII字符組成的單詞,等價於[a-zA-Z0-9]
\W 任何非ASCII字符組成的單詞,等價於[^a-zA-Z0-9]
\s 任何Unicode空白符
\S 任何非Unicode空白符
\d 任何ASCII數字,等價於[0-9]
\D 任何非ASCII數字,等價於[^0-9]
[\b] 退格直接量

demo:瀏覽器

/\w\w\d\d\d/.test('lt666');//true 匹配兩個字母或者數字加三個數字的字符串cookie


4.重複字符匹配

字符 匹配
{n,m} 前一項至少n次,但不超過m次
{n,} 前一項n次或者更屢次
{n} 前一項n次
? 前一項0次或者1次,等價於{0,1}
0 前一項至少1次或者更屢次,等價於{1,}
* 前一項0次或者更屢次,等價於{0,}

demo:app

/\d{4,9}/.test(1314);//true 匹配4到9個數字
//下面的例子稍微有點複雜,仔細分析也很簡單
/\w{3}\s?\w{2,4}\s+javascript+\s+[^(]*/.test('ccy is javascript coder');//true 匹配3個字母或數字加0個或1個空格加2到4個字母或數字加至少1個空格加javascript加至少1個空格加0個或多個左反圓括號字符


重複匹配還種模式:非貪婪模式(儘量的少匹配),只需在待匹配的字符後跟隨一個?

??、+?、*?、{1,5}?

/\d{4,9}/.exec(131414131);//131414131
/\d{4,9}?/.exec(131414131);//1314
下面這種狀況貪婪和非貪婪是同樣的效果
/c+y/.exec('ccy');//ccy
/c+?y/.exec('ccy');//ccy
這是由於正則表達式的模式匹配老是會尋找字符串中第一個可能匹配的位置


5.選擇、分組和引用

javascript正則語法還包括指定選擇項、子表達式分組和引用前一子表達式的特殊字符。

字符 含義
| 選擇,匹配的是該符號左邊的子表達式或者右邊的子表達式
(…) 組合,將幾個項組合爲一個單元,這個單元可經過* + ? | 等符號加以修飾,並且記住和這個組合相匹配的字符串以供此後的引用使用
(?:...) 只組合,把項組合到一個單元,但不記憶與改組相匹配的字符
\n 和第n個分組第一次匹配的字符相匹配,組是圓括號中的子表達式(也多是嵌套的),組索引是從左到右的左括號數,(?: 形式的分組不編碼

1.選擇

字符 | 用於分隔供選擇的字符,選擇項的嘗試匹配是從左至右,直到發現了匹配項。

注:若是左邊的選擇項匹配就會忽略右邊的匹配項,即便它產生更好的匹配

2.組合引用

正則表達式中的圓括號 () 有多中做用:

a.一個是把單獨的項組合成子表達式;

b.一個是在完整的模式中定義子模式;

c.容許在同一正則表達式的後部引用前面的子表達式,引用的是實例而非匹配模式。

注:perl風格的\n,RegExp對象則$n,以左圓括號爲子表達式索引,從1開始

'AA Am 99'.match(/(\w)\1/g);//["AA","99"]

/(A+)((B|C|D)+)(E+)/.exec('ABCDE');//["ABCDE","A","BCD","D","E"];


6.指定匹配位置

正則表達式中匹配位置是一個難點

錨字符與斷言

字符 含義
^ 匹配字符串的開頭,在多行檢索中匹配一行的開頭
$ 匹配字符串的結尾,在多行檢索中匹配一行的結尾
\b 匹配一個單詞的邊界,就是位於\w與\W之間的位置
\b 匹配非單詞邊界的位置
(?=x) 零寬度正先行斷言。僅當子表達式 X 在 此位置的右側匹配時才繼續匹配。例如,/w+(?=/d) 與後跟數字的單詞匹配,而不與該數字匹配。此構造不會回溯。
(?!=x) 零寬度負先行斷言。僅當子表達式 X 不在 此位置的右側匹配時才繼續匹配。例如,例如,/w+(?!/d) 與後不跟數字的單詞匹配,而不與該數字匹配 。
(?<=X) 零寬度正後發斷言。僅當子表達式 X 在 此位置的左側匹配時才繼續匹配。例如,(?<=19)99 與跟在 19 後面的 99 的實例匹配。此構造不會回溯。
(?<!X) 零寬度負後發斷言。僅當子表達式 X 不在此位置的左側匹配時才繼續匹配。例如,(?<!19)99 與不跟在 19 後面的 99 的實例匹配

demo:

要匹配<title>javascript</title>中的javascript,此時用斷言最合適

/(?<=<title>).*(?=<\/title>)/.exec('<title>javascript</title>');//javascript

(?<=<title>)零寬度正後發斷言,斷言<title>在當前位置左側;

(?=<\/title>)零寬度正先行斷言,斷言</title>在當前位置的右側,/ 須要加 \ 轉義

細心體會一下


不用斷言截取以下

'<title>javascript</title>'.match(/^<title>(.*)<\/title>$/)[1];//javascript


7.修飾符

字符 含義
I 不區分大小寫
g 全局匹配
m 多行匹配模式

8.用於匹配模式的String方法

1.search(reg)

參數reg爲正則表達式,返回第一個與之匹配的子串的起始位置,如找不到則返回-1
"javascript".search(/script/i); //4

注:search方法不支持全局檢索,由於它會忽略正則表達式中的修飾符g

2.replace(reg,str)

用以執行檢索與替換操做,注意出現$n則說明匹配子表達式
"javascript".replace(/javascript/gi,"JavaScript");

3.match(reg)

返回一個由匹配結果組成的數組,若是reg中設置了修飾符g,則返回的數組包含字符串中的全部匹配結果,若沒有g,就不會進行全局檢索,只會檢索第一個匹配。
"1 plus 2 equals 3".match(/\d+/g); 返回["1","2","3"]

4.split(param)

參數能夠爲字符串也能夠爲正則表達式
"1,2,3,4,5".split(/,/);返回["1","2","3","4","5"]


咱們常常會匹配瀏覽器中cookie值

document.cookie="name=ccy;age=18";

/(^|;| )age=([^;]*)(;|$)/g.exec(document.cookie)[2];//18


9.RegExp對象

RegExp第一個參數包含正則表達式的主體部分,也就是直接量中兩條斜線之間的文本,不管是字符串直接量仍是正則表達式都使用 \ 字符做爲轉義字符的前綴,
所以當給RegExp()傳入一個字符串表述正則表達式時,必須將 \ 替換成 \\
第二個參數是可選的,只能傳 g i m,或者它們的組合
var zipcode = new RegExp("\d{5}","g");

1.RegExp屬性
source:是一個只讀字符串,包含正則表達式的文本
global:是一個只讀的布爾值,用以說明這個正則表達式是否帶有修飾符g
ignoreCase:是一個只讀的布爾值,用以說明正則表達式是否帶有修飾符i
multiline:是一個只讀的布爾值,用以說明正則表達式是否帶有修飾符m
lastIndex:是一個可讀/寫的整數,若是匹配模式帶有g修飾符,這個屬性存儲在整個字符串的下一次檢索的開始位置,會被exec(),test()方法用到

2.RegExp方法exec()執行字符串的匹配檢索,相似String.match(),都會返回一個數組test()當調用exec方法返回不爲null則調用test方法返回爲true

相關文章
相關標籤/搜索