表達式 | 名稱 | 描述 |
---|---|---|
?=exp | 正向前瞻 | 零寬度,斷言出現(xiàn)的位置后面能匹配exp岔冀,則匹配成功,匹配不占據(jù)匹配長度叠洗,非捕獲 |
?!exp | 負向前瞻 | 零寬度禁舷,斷言出現(xiàn)的位置后面不能匹配exp,則匹配成功谣光,匹配不占據(jù)匹配長度檩淋,非捕獲 |
?:exp | 正向前瞻 | 非捕獲性分組,斷言出現(xiàn)位置后面匹配exp萄金,占據(jù)查詢的匹配長度 |
零寬度:表示只匹配位置蟀悦,不匹配字符
栗子一:
str.replace( /\B(?=(?:\d{3})+$)/g, ',' );
分析:
\B 或者 \b 匹配到的是一個位置,沒有字符氧敢,
\B:表示非單詞邊界
\b:表示單詞邊界
之后了解?= ?:之間的差別
?=exp 表示零寬度正預測先行斷言熬芜,簡單來說,就是在斷言出現(xiàn)的位置后面必須匹配exp福稳,否則匹配失敗,當匹配成功瑞侮,也不會占據(jù)查詢長度(也就是下一個查詢的index與exp匹配成功的長度無關)
?:exp 表示非捕獲性分組的圆,若匹配成功,不會存在匹配成功的分組當中半火,但是會占據(jù)查詢長度越妈。
所以這一個正則的匹配思路為:
栗子:
'1234567'.replace(/\B(?=(?:\d{3})+$)/g, ';') // 1,234,567
先匹配第一個非單詞邊界(1和2之間),然后?=預測后面的內(nèi)容為\d{3}三個連續(xù)的數(shù)字钮糖,+做循環(huán)梅掠,不斷檢測三個連續(xù)數(shù)字酌住,(234 567),當數(shù)字匹配完之后阎抒,開始檢查是否為字符串結(jié)尾酪我,若為結(jié)尾,則匹配成功且叁;接著從第二個單詞邊界開始(2和3之間)都哭,……
最后查詢結(jié)束符合匹配的就在1和2之間 4和5之間
栗子二:
/*將字符串中除了div和p標簽之外替換成p*/
var input = '<div class="beautiful">,<p class="provocative">,<span class="sexy">,<h1 class="attractive" id="header">,</h1>,</span>,</p>,</div>';
var output = input.replace(/<(\/?)(?!div|p|\/p|\/div)(?:[a-z0-9]+)(.*?)>/g, '<$1p$2>');
console.log(input);
console.log(output);
//<div class="beautiful">,<p class="provocative">,<span class="sexy">,<h1 class="attractive" id="header">,</h1>,</span>,</p>,</div>
//<div class="beautiful">,<p class="provocative">,<p class="sexy">,<p class="attractive" id="header">,</p>,</p>,</p>,</div>
分析:
以<開始,可匹配/或者不匹配(有逞带?欺矫,?表示0或以上)展氓,后面不為div或p或/p或/div(有?! 表示負向前瞻)穆趴,后面為多個數(shù)字或者小寫字母,但是不捕獲遇汞,占據(jù)位置未妹,最后可有可無的多個任意字符