javascript中replace( )方法的使用_javascript技巧

來源:互聯網
上載者:User

最近在瀏覽一些阿里的前端面試題,其中有一題涉及了javascript中replace( )方法的使用,下面是原題:

“說出以下函數的作用是?空白地區應該填寫什嗎?”

 // define  (function (window) {    function fn(str) {      this.str = str;    }    fn.prototype.format = function () {      var arg = ______;      return this.str.replace(_______, function (a, b) {        return arg[b] || '';      });    }    window.fn = fn;  })(window);  // use  (function(){    var t = new fn('<p><a href="{0}">{1}</a><span>{2}</span></p>');   console.log( t.format('http://www.alibaba.com', 'Alibaba', 'Welcome') );  })();

以下是分析過程(感覺還是弄個編號,個人覺得比較有條理一些)

1、因為本題也涉及了到其它的知識點,如匿名函數、原型等知識點,但不是本次討論的重點。

2、根據題面,我們知道,該題的源碼類似於寫一個模板引擎。將模板裡的‘{1}'之類的預留位置替換成傳給它的參數。所以arg應該就是arguments。但是!!!由於arg不是數組,而是一個類數組對象(不懂的可自行百度(u_u)),所以我們需要進行一些轉換,

複製代碼 代碼如下:
var arg=Array.prototype.slice.call(arguments,0);

3、等號右邊也就是第一空的答案了。說了這麼多,那麼接下來第二空就是我們要討論的重點了~~~~~~我們都知道第二空是要通過正則找出預留位置,並根據預留位置內的數字將其替換成arg數組內的字串,說實話replace方法的第二個參數為函數的情況很少遇到,一般我們遇到都是這樣的,看下面的代碼:

複製代碼 代碼如下:

 var pattern=/8(.*)8/;
 var str='This is a 8baidu8';
 document.write(str.replace(pattern,'<strong>$1</strong>'));

4、由於replace第二個參數是函數的情況比較少,那麼我們就來重點談談第二個參數為函數的情形。

首先這是replace函數的文法:stringobject.replace(regexp/substr,replacement)

其中regexp/substr必需。規定字串或要替換的模式的regexp對象。(請注意,如果該值是一個字串,則將它作為要檢索的直接量文字模式,而不是首先被轉換為 regexp 對象。) replacement必需。一個字串值。規定了替換文本或產生替換文本的函數。最後返回一個新的字串,是用replacement替換了regexp的第一次匹配或所有匹配之後得到的。

5、ECMAScript規定,replace()方法的參數replacement可以是函數而不是字串。在這種情況下,每個匹配都調用該函數,它返回的字串將替換文本使用。第一個參數表示匹配到的字元,第二個參數表示匹配到的字元最小索引位置(RegExp.index),第三個參數表示被匹配的字串(RegExp.input)。

6、所以第二空可以這樣寫:/\{(\d+)\}/g,放在語句中完整為:

複製代碼 代碼如下:

return this.str.replace(/\{(\d+)\}/g, function (a, b) { 
    return arg[b] || ''; 
});

執行第一次匹配時,{0}被替代為arg[0]
執行第一次匹配時,{1}被替代為arg[1]
執行第一次匹配時,{2}被替代為arg[2]

7、以上就是js字串方法replace()的第二個參數為函數講解(有不完善的地方,自行補充),當然這道面試題也解決了~~~~~

以上所述就是本文的全部內容了,希望大家能夠喜歡。

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.