前言

replace第一個參數(shù)一般放置的是正則表達式，用來匹配想要替換的文本；第二個參數(shù)一般我們放入的是字符串，用來替換掉正則匹配到的文本。

其實replace遠比上面說的要強大的多，它的內(nèi)部已經(jīng)封裝的很完善了，遠不是我們想象的那么簡單，下面我們就來詳細聊聊replace的第二個參數(shù)。

實例介紹

現(xiàn)在要實現(xiàn)一個功能，把HTML中的字符實體轉(zhuǎn)換成它們所對應(yīng)的字符，比如："&lt;"轉(zhuǎn)換成對對應(yīng)字符為:"<"。

下面我們來看看代碼實現(xiàn):

String.prototype.deentityfy=(function(){
  var entity = {
  lt:'<',
  gt:'>'
  };
  return function(){
  return this.replace(/&([^&;]+);/g,
   function(a,b,c,d){
   console.log('a:'+a+'---b:'+b+'---c:'+c+'---d:'+d);
   var r = entity[b];
   return typeof r ==='string' ? r : a ;
   })
  }
 }())
 document.write('&lt;h1&gt;我是標(biāo)題&lt;/h1&gt;'.deentityfy());

這里得講講字符實體，以免下面混淆。

字符實體是不會當(dāng)作HTML語句來解析的，比如上面的'&lt;h1&gt;我是標(biāo)題&lt;/h1&gt;'這一段輸出到頁面上，我們看到的是這樣的：

<h1>只是被瀏覽器當(dāng)作字符串輸出，而不是標(biāo)簽輸出，上面這段代碼就是把這些字符實體轉(zhuǎn)換成對應(yīng)字符，能夠被瀏覽器所編譯。

我們一步步來看上面的代碼是怎么實現(xiàn)的。

首先，給String對象的原型掛載了一個deentityfy方法，這個方法是個自執(zhí)行函數(shù)，使用閉包的形式，函數(shù)內(nèi)的所有內(nèi)容對外都是不可見的。

函數(shù)內(nèi)，我們定義了一個entity對象字面量，里面有兩個屬性，分別對應(yīng)標(biāo)簽的左右尖括號。

接下來return一個匿名函數(shù)，把我們要做的事寫在這個函數(shù)內(nèi)。

我們調(diào)用replace方法，第一個參數(shù)放置正則表達式：

/&([^&;]+);/g

這段正則表達式的匹配規(guī)則是：以"&"開頭，后面緊跟一個或一個以上不是"&"和";"的字符，以";"結(jié)束。后面的g代表全局匹配。（更多有關(guān)正則表達式的學(xué)習(xí)請點擊這里）

這里著重說下，正則中的"()"和javascript中運算時使用的"()"概念是不同的，這里的括號術(shù)語叫做:捕獲括號。簡單的說就是把括號內(nèi)匹配到的字符暫時儲存起來，在待會的替換環(huán)節(jié)可以取出來用。

接下來詳細講講replace的第二個參數(shù)，也就是本文的重點。

我們一般是放一個字符串在第二個參數(shù)中，直接用于替換所匹配到的字符；還有更高階的技巧，使用$字符可以取得捕獲括號中的內(nèi)容，再進行相關(guān)操作。

還有第三種方法， 給第二個參數(shù)傳入匿名函數(shù)，函數(shù)的返回值用做替換的字符。

匿名函數(shù)有4個參數(shù)可以傳入，當(dāng)然，這些參數(shù)都不是必須要傳的。

　　第一個參數(shù)：正則所匹配到的字符；

　　第二個參數(shù)：捕獲括號所捕獲到的字符；

　　第三個參數(shù)：正則匹配到的每段字符的第一個字符的索引；

　　第四個參數(shù)：用于匹配的字符串主體；

我把上面代碼的運行結(jié)果打印出來大家應(yīng)該就很清晰了：

總結(jié)

好了，以上就是這篇文章的全部內(nèi)容了，接觸正則也快三年時間了，一直不知道正則還有這么強大的功能，當(dāng)然也可能是我孤陋寡聞啦。希望大家永葆一顆學(xué)習(xí)的心，一起進步。同時也希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作能帶來一定的幫助，如果有疑問大家可以留言交流。

最新評論