javascript筆記 String類replace函數的一些事

來源:互聯網
上載者:User

我最近查閱javascript資料,發現了一個函數: 複製代碼 代碼如下:function format(s)
{
var args = arguments;
var pattern = new RegExp("%([1-" + arguments.length + "])","g");
return String(s).replace(pattern,function(word,index){
return args[index];
});
}
// test
window.onload = alert(format("And the %1 want to know whose %2 you %3", "papers", "shirt", "wear"));
//And the papers want to know whose shirt you wear

這種功能的函數,在shell或java都似曾見過,但是在javascript函數實現的方法很新穎。新穎的地方就是在: 複製代碼 代碼如下:return String(s).replace(pattern,function(word,index){
return args[index];
});

但是這裡String類的replace的用法和我平時用的很不一樣,我以前寫過一個這樣的replace的函數: 複製代碼 代碼如下:function myReplace(s)
{
return String(s).replace(/CJ[0-9]{2}/g,function(word){
return word = 'CJJK00';
});
}
//window.onload = alert(myReplace('CJ9080,CJ8976,CJ12919,CJ8765'));//CJJK0080,CJJK0076,CJJK00919,CJJK0065

我在使用replace時候,如果第二個參數是function我一般都只用到第一個參數,基本沒有思考它的第二個,第三個或者更多的參數,現在看到有人使用了第二個參數,就很想探求下replace第二個參數使用到了function時候,裡面參數到底有多少個,每個的含義到底如何?
下面是我改寫了我自己寫的替換函數: 複製代碼 代碼如下:function myReplaceFtn(s)
{
return String(s).replace(/CJ[0-9]{2}/g,function(word,index){
return word = 'CJJK00@' + index + "@";
});
}
//window.onload = alert(myReplaceFtn('CJ9080,CJ8976,CJ12919,CJ8765'));//CJJK00@0@80,CJJK00@7@76,CJJK00@14@919,CJJK00@22@65

本來我以為,函數format裡的function(word,index),我認為應該是Regex所匹配字串的索引(%1的索引為1,%2的索引為2,%3的索引為3),而我寫的函數裡面第二個參數index不是被匹配到字串的索引,而是被匹配到的字元在原字串的位置。下面我做了這樣的測試: 複製代碼 代碼如下:function format(s)
{
var args = arguments;
var pattern = new RegExp("%([1-" + arguments.length + "])","g");
return String(s).replace(pattern,function(word,index){
alert("arguments.length:" + arguments.length);//4
return args[index];
});
}
function myReplaceFtn(s)
{
return String(s).replace(/CJ[0-9]{2}/g,function(word,index){
alert("arguments.length:" + arguments.length);//3
return word = 'CJJK00@' + index + "@";
});
}

函數format裡面function(word,index)的參數有4個,而函數myReplaceFtn(s)裡面function(word,index)的參數有3個。為什麼會有這樣的不同?我做了如下測試: 複製代碼 代碼如下://以下程式在firefox裡面運行
function newformat(s)
{
var args = arguments;
var pattern = new RegExp("%([1-" + arguments.length + "])","g");
return String(s).replace(pattern,function(word,index){
console.log("arguments.length:" + arguments.length);
for (var i = 0,j = arguments.length;i<j;i++)
{
console.log("標示newformat" + i + ":" + arguments[i]);
}
return args[index];
});
}
function newmyReplace(s)
{
return String(s).replace(/CJ[0-9]{2}/g,function(word){
console.log("arguments.length:" + arguments.length);
for (var i = 0,j = arguments.length;i<j;i++)
{
console.log("標示newmyReplace" + i + ":" + arguments[i]);
}
return word = 'CJJK00';
});
}

結果:
arguments.length:4
標示newformat0:%1
標示newformat1:1
標示newformat2:8
標示newformat3:And the %1 want to know whose %2 you %3
arguments.length:4
標示newformat0:%2
標示newformat1:2
標示newformat2:30
標示newformat3:And the %1 want to know whose %2 you %3
arguments.length:4
標示newformat0:%3
標示newformat1:3
標示newformat2:37
標示newformat3:And the %1 want to know whose %2 you %3
arguments.length:3
標示newmyReplace0:CJ90
標示newmyReplace1:0
標示newmyReplace2:CJ9080,CJ8976,CJ12919,CJ8765
arguments.length:3
標示newmyReplace0:CJ89
標示newmyReplace1:7
標示newmyReplace2:CJ9080,CJ8976,CJ12919,CJ8765
arguments.length:3
標示newmyReplace0:CJ12
標示newmyReplace1:14
標示newmyReplace2:CJ9080,CJ8976,CJ12919,CJ8765
arguments.length:3
標示newmyReplace0:CJ87
標示newmyReplace1:22
標示newmyReplace2:CJ9080,CJ8976,CJ12919,CJ8765
對於回呼函數裡的arguments值現在比較清晰了,arguments個數的不同應該和我們寫的Regex有關係,不管怎樣,第一個參數是匹配到的字串,最後一個是原字串,倒數第二個參數是匹配到的字串的在原字串索引的起始位,像format裡的第二個參數index根據情況而定了,我自己寫的newmyReplace裡沒有這個參數,format的index參數是%[1-4],裡面的1-4,不過還是寫個方法確定下: 複製代碼 代碼如下:function charFormat(s)
{
var pattern = new RegExp("%([a-d])","g");
return String(s).replace(pattern,function(word,index){
switch(index)
{
case 'a':
return 'thisisA';
case 'b':
return 'thisisB';
case 'c':
return 'thisisC';
case 'd':
return 'thisisD';
default:
return 'thisisNULL';
}
});
}
window.onload = console.log(charFormat("And the %a want to know whose %d you %b", "papers", "shirt", "wear"));
//And the thisisA want to know whose thisisD you thisisB

由此可見String的replace是相當的強大,不過本人Regex功力還不夠,不知道還有什麼別的特別的Regex會產生什麼不同的結果。另外不知道誰有javascript裡面String類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.