最近在看《高性能網(wǎng)站建設(shè)進階指南》,第七章為《編寫高效的javascript》,作者為Nicholas C. Zakas(同時也是《javascript高級程序設(shè)計》的作者),里面講到字符串連接的優(yōu)化問題。
字符串連接一直是javascript中性能最低的操作之一,通常情況下,字符串連接是通過使用加法運算符(+)來實現(xiàn)的,比方說
var text="hello";
text+=" ";
text+="world!";
早期瀏覽器沒有對這種運算進行優(yōu)化。由于字符串是不可變的,這意味著要創(chuàng)建中間字符串來存儲連接的結(jié)果。參照《javascript高級程序設(shè)計》,大致要經(jīng)過以下幾個步驟:
頻繁地在后臺創(chuàng)建和銷毀字符串會導(dǎo)致字符串連接的性能異常低下。 好在如今大部分瀏覽器已經(jīng)對字符串連接進行了優(yōu)化。第一款進行優(yōu)化的瀏覽器是Firefox,從1.0版本開始,在所有情況下使用數(shù)組技術(shù)實際上都比使用加法運算慢。其他瀏覽器也優(yōu)化了字符串連接,Safari、Opera、Chrome和Internet Explorer8也都在使用加法運算符上表現(xiàn)出了更好的性能。(PS:在Ie8之前的版本沒有進行優(yōu)化) 那么,在瀏覽器還未對字符串連接性能進行優(yōu)化之前,該怎么改進其性能呢?其中一種普遍使用的方法就是使用Array對象,方法如下: function StringBuffer(){ this._strings=new Array(); } StringBuffer.prototype.append=function(str){ this._strings.push(str) } StringBuffer.prototype.toString=function(){ return this._strings.join(""); } 這樣,無論在數(shù)組中引入多少字符串都不成問題,因為只有在調(diào)用join()方法時才會發(fā)生連接操作,此時步驟如下: 經(jīng)過測試,采用上述方法,在Firefox 3.6中以及Ie 8中,性能其實比直接用加法運算符(+)效率要低(上文說過現(xiàn)在大部分主流瀏覽器都已經(jīng)經(jīng)過優(yōu)化),然而,在IE 8之前版本的IE瀏覽器中,采用這種方法連接字符串,性能比直接用加法運算符(+)有很大的提高,大概是60%左右(也就是花費的時間為原來的1/3左右),用的是《javascript高級程序設(shè)計》里的測試代碼: var d1=new Date(); alert("d3:"+d3+" d4:"+d4); 以下是Nicholas C. Zakas大牛對決定如何連接字符串的建議,需要考慮兩個因素:(1)被連接的字符串大?。?)數(shù)量 原文:http://www.cnblogs.com/chyingp/archive/2010/10/07/1844887.html
var str="";
for(var i=0;i<10000;i++){
str+="text";
}
var d2=new Date();
var d3=d2.getTime()-d1.getTime();
var buffer=new StringBuffer();
d1=new Date();
for(var j=0;j<10000;j++){
buffer.append("text");
}
var result=buffer.toString();
d2=new Date();
var d4=d2.getTime()-d1.getTime();