JavaScript 字符串連接性能優化

2024-05-06 14:16:27

字體：大中小

來源：轉載

供稿：網友

代碼如下:
var str = "hello";
str += " world";

后臺所做工作：
1）創建存儲 "hello" 的字符串，且使 str 指向它。
2）創建存儲 "world" 的字符串。
3）創建存儲結果的字符串。
4）將 str 中的當前內容復制到結果字符串中。
5）把 world 復制到結果字符串中。
6）更新 str ，使 str 指向結果字符串。
每拼接一次字符串就循環重復2）~6），如果重復成百上千次則會非常消耗資源，影響性能。
解決方法：
使用 Array 對象存儲字符串，之后使用 join（）方法輸出結果。
仿照 Java 中的 StringBuffer 類。
代碼如下:
function StringBuffer(){
this._strings = new Array;
}
StringBuffer.prototype.append = function (str){
this._strings.push(str);
}
StringBuffer.prototype.toString = function (){
return this._strings.join("");
}

測試性能：
代碼1：使用 "+=" 拼接字符串
代碼如下:
var d = new Date();
var str = "";
for(var i=0;i<10000;i++){
str += "test";
}
var d2 = new Date();
document.writeln(d2.getTime()-d.getTime());

代碼2：使用 StringBuffer
代碼如下:
var d = new Date();
var str = new StringBuffer();
for(var i=0;i<10000;i++){
str.append("test");
}
var res = str.toString();
var d2 = new Date();
document.writeln(d2.getTime()-d.getTime());

從多次測試結果看來，使用StringBuffer 可以節省50%以上的時間。

上一篇：javascript 時間對象的練習

下一篇：JS checkbox控制操作代碼