引言：JS 正則表達(dá)式是 JS 學(xué)習(xí)過程中的一大難點，繁雜的匹配模式足以讓人頭大，不過其復(fù)雜性和其學(xué)習(xí)難度也賦予了它強(qiáng)大的功能。文章從 JS 正則表達(dá)式的正向前瞻說起，實現(xiàn)否定匹配的案例。本文適合有一定 JS 正則表達(dá)式基礎(chǔ)的同學(xué)，如果對正則表達(dá)式并不了解，還需先學(xué)習(xí)基礎(chǔ)再來觀摩這門否定大法。
一、標(biāo)簽過濾需求
不知道大家在寫JS有沒有遇到過這樣的情況，當(dāng)你要處理一串字符串時，需要寫一個正則表達(dá)式來匹配當(dāng)中不是 XXX 的文本內(nèi)容。聽起來好像略有些奇怪，匹配不是 XXX 的內(nèi)容，不是 XXX 我匹配它干嘛啊，我要啥匹配啥不就完了。你還別說，這個玩意還真的有用，不管你遇沒遇到過，反正我是遇到了。具體的需求例如：當(dāng)你收到一串HTML代碼，需要對這一串HTML代碼過濾，將里面所有的非<p>標(biāo)簽都改為<p>。這里肯定有不少同學(xué)就要嫌棄了，“將所有標(biāo)簽都改為<p>，那就把任意標(biāo)簽都改為<p>不就完了？”，于是乎一行代碼拍腦袋而生：
1 var str = '<div>,<p>,<h1>,<span>,</span>,</h1>,</p>,</div>';2 var reg = /<(\/?).*?>/g;3 var newStr = str.replace(reg, "<$1p>");4 console.log(newStr);//<p>,<p>,<p>,<p>,</p>,</p>,</p>,</p>
注意這個方法中有一個引用符 “$1” ，這個的意思引用正則的表達(dá)式的第1個分組，可以用$N來表示在正則表達(dá)式中的第N個捕獲的引用。就那上面的例子來說，"(\/?)"這個一個表達(dá)式的含義是，"\/"這個字符出現(xiàn)0次或者1次，而$1這個引用呢就相當(dāng)于和“\/”這個字符門當(dāng)戶對的大閨女，她已下定決心此生非"\/"不嫁。所以當(dāng)匹配到有一個“\/”的時候，$1這個引用就把它捕獲下來，從現(xiàn)在起，你的就是我的，我的就是你的啦，因此$1等價于"(\/?)"所匹配到的字符；反之如果沒有匹配到"\/"這個字符，那$1這個引用就得空守閨房，獨(dú)立熬過一個又一個漫長的夜晚，因為它內(nèi)心極度的空虛，所以$1就等價于""（也就是空串）。
延伸閱讀
- ssh框架 2016-09-30
- 阿里移動安全 [無線安全]玩轉(zhuǎn)無線電——不安全的藍(lán)牙鎖 2017-07-26
- 消息隊列NetMQ 原理分析4-Socket、Session、Option和Pipe 2024-03-26
- Selective Search for Object Recognition 論文筆記【圖片目標(biāo)分割】 2017-07-26
- 詞向量-LRWE模型-更好地識別反義詞同義詞 2017-07-26
- 從棧不平衡問題 理解 calling convention 2017-07-26
- php imagemagick 處理 圖片剪切、壓縮、合并、插入文本、背景色透明 2017-07-26
- Swift實現(xiàn)JSON轉(zhuǎn)Model - HandyJSON使用講解 2017-07-26
- 阿里移動安全 Android端惡意鎖屏勒索應(yīng)用分析 2017-07-26
- 集合結(jié)合數(shù)據(jù)結(jié)構(gòu)來看看(二) 2017-07-26
學(xué)習(xí)是年輕人改變自己的最好方式