快捷導(dǎo)航

javascript筆記 String類replace函數(shù)的一些事

更新時(shí)間：2011年09月22日 23:52:44 作者：

加固javascript基礎(chǔ)知識(shí)目的是為以后研究jQuery源碼做好鋪墊。

我最近查閱javascript資料，發(fā)現(xiàn)了一個(gè)函數(shù)：

 
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 

這種功能的函數(shù)，在shell或java都似曾見(jiàn)過(guò)，但是在javascript函數(shù)實(shí)現(xiàn)的方法很新穎。新穎的地方就是在：

復(fù)制代碼代碼如下:

 
return String(s).replace(pattern,function(word,index){ 
return args[index]; 
}); 

但是這里String類的replace的用法和我平時(shí)用的很不一樣，我以前寫(xiě)過(guò)一個(gè)這樣的replace的函數(shù)：

復(fù)制代碼代碼如下:

 
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時(shí)候，如果第二個(gè)參數(shù)是function我一般都只用到第一個(gè)參數(shù)，基本沒(méi)有思考它的第二個(gè)，第三個(gè)或者更多的參數(shù)，現(xiàn)在看到有人使用了第二個(gè)參數(shù)，就很想探求下replace第二個(gè)參數(shù)使用到了function時(shí)候，里面參數(shù)到底有多少個(gè)，每個(gè)的含義到底如何？
下面是我改寫(xiě)了我自己寫(xiě)的替換函數(shù)：

復(fù)制代碼代碼如下:

 
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 

本來(lái)我以為，函數(shù)format里的function(word,index)，我認(rèn)為應(yīng)該是正則表達(dá)式所匹配字符串的索引（%1的索引為1，%2的索引為2，%3的索引為3），而我寫(xiě)的函數(shù)里面第二個(gè)參數(shù)index不是被匹配到字符串的索引，而是被匹配到的字符在原字符串的位置。下面我做了這樣的測(cè)試：

復(fù)制代碼代碼如下:

 
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 + "@"; 
}); 
} 

函數(shù)format里面function(word,index)的參數(shù)有4個(gè)，而函數(shù)myReplaceFtn(s)里面function(word,index)的參數(shù)有3個(gè)。為什么會(huì)有這樣的不同？我做了如下測(cè)試:

復(fù)制代碼代碼如下:

 
//以下程序在firefox里面運(yùn)行 
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("標(biāo)示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("標(biāo)示newmyReplace" + i + "：" + arguments[i]); 
} 
return word = 'CJJK00'; 
}); 
} 

結(jié)果：
arguments.length:4
標(biāo)示newformat0：%1
標(biāo)示newformat1：1
標(biāo)示newformat2：8
標(biāo)示newformat3：And the %1 want to know whose %2 you %3
arguments.length:4
標(biāo)示newformat0：%2
標(biāo)示newformat1：2
標(biāo)示newformat2：30
標(biāo)示newformat3：And the %1 want to know whose %2 you %3
arguments.length:4
標(biāo)示newformat0：%3
標(biāo)示newformat1：3
標(biāo)示newformat2：37
標(biāo)示newformat3：And the %1 want to know whose %2 you %3
arguments.length:3
標(biāo)示newmyReplace0：CJ90
標(biāo)示newmyReplace1：0
標(biāo)示newmyReplace2：CJ9080,CJ8976,CJ12919,CJ8765
arguments.length:3
標(biāo)示newmyReplace0：CJ89
標(biāo)示newmyReplace1：7
標(biāo)示newmyReplace2：CJ9080,CJ8976,CJ12919,CJ8765
arguments.length:3
標(biāo)示newmyReplace0：CJ12
標(biāo)示newmyReplace1：14
標(biāo)示newmyReplace2：CJ9080,CJ8976,CJ12919,CJ8765
arguments.length:3
標(biāo)示newmyReplace0：CJ87
標(biāo)示newmyReplace1：22
標(biāo)示newmyReplace2：CJ9080,CJ8976,CJ12919,CJ8765
對(duì)于回調(diào)函數(shù)里的arguments值現(xiàn)在比較清晰了，arguments個(gè)數(shù)的不同應(yīng)該和我們寫(xiě)的正則表達(dá)式有關(guān)系，不管怎樣，第一個(gè)參數(shù)是匹配到的字符串，最后一個(gè)是原字符串，倒數(shù)第二個(gè)參數(shù)是匹配到的字符串的在原字符串索引的起始位，像format里的第二個(gè)參數(shù)index根據(jù)情況而定了，我自己寫(xiě)的newmyReplace里沒(méi)有這個(gè)參數(shù)，format的index參數(shù)是%[1-4],里面的1-4，不過(guò)還是寫(xiě)個(gè)方法確定下：

復(fù)制代碼代碼如下:

 
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 

由此可見(jiàn)String的replace是相當(dāng)?shù)膹?qiáng)大，不過(guò)本人正則表達(dá)式功力還不夠，不知道還有什么別的特別的正則表達(dá)式會(huì)產(chǎn)生什么不同的結(jié)果。另外不知道誰(shuí)有javascript里面String類replace原始寫(xiě)法，希望能貢獻(xiàn)出來(lái)，我想好好研究下。

您可能感興趣的文章: