|
|
Js代碼
復制代碼 代碼如下:
var str = "Hello ";
str += "world";
執行的步驟如下：
創建存儲“Hello“的字符串
創建存儲”world“的字符串
創建存儲連接結果的字符串
把str的當前內容復制到結果中
把“world”復制到結果中
更新str，使它指向結果
每次完成字符串的連接都會執行步驟2-6，使得這種操作非常消耗資源。想象一下重復這個過程幾百次，甚至幾千次，那性能如何？
二、那么再看看下面的代碼,來解決這種窘況
Js代碼
復制代碼 代碼如下:
var arr = new Array;
arr[0] = "Hello ";
arr[1] = "world";
var str = arr.join("");
執行的步驟如下：
創建存儲結果的字符串
把每個字符串復制到結果中的適當位置
這樣，無論數組要引入多少字符串都不成問題，因為只有在調用join()方法時候才會發生連接操作。
三、覺得操作很復雜？代碼不能確切反應它的意圖？那么我們用對象的解決方式吧，使它更容易理解，用StringBuffer類來封裝該功能：
Js代碼
復制代碼 代碼如下:
function StringBuffer() {
this._strs = new Array;
}
StringBuffer.prototype.append = function (str) {
this._strs.push(str);
};
StringBuffer.prototype.toString = function() {
this._strs.join("");
};
好了，感受一下吧，現在如何操作字符串呢？
Js代碼
復制代碼 代碼如下:
var sb = new StringBuffer();
sb.append("Hello ");
sb.append("world");
var result = sb.toString();
四、似乎色香味俱全了，但是吃下去的功效如何？
Js代碼
復制代碼 代碼如下:
var tStart = new Date();
var str = "";
for(var i=0;i<10000;i++)
{
str += "text"
}
var tEnd = new Date();
document.write("原始的方法加號 拼接10000個字符串 花費時間："+(tEnd.getTime()-tStart.getTime())+"秒");
var oSB = new StringBuffer();
tStart = new Date();
for(var i=0;i<10000;i++)
{
oSB.append("text");
}
var sRst = oSB.toString();
tEnd = new Date();
document.write("<br/>StringBuffer 拼接10000個字符串 花費時間："+(tEnd.getTime()-tStart.getTime())+"秒");
可能你已經猜到了，StringBuffer要比+快，到底快多少呢？我的測試結果：
Js代碼
FF3.0.10
原始的方法加號 拼接10000個字符串 花費時間：3豪秒
StringBuffer 拼接10000個字符串 花費時間：8豪秒
IE7
原始的方法加號 拼接10000個字符串 花費時間：15豪秒
StringBuffer 拼接10000個字符串 花費時間：16豪秒
IE8
原始的方法加號 拼接10000個字符串 花費時間：15豪秒
StringBuffer 拼接10000個字符串 花費時間：16豪秒
Chrome1.0.154.46
原始的方法加號 拼接10000個字符串 花費時間：1豪秒
StringBuffer 拼接10000個字符串 花費時間：2豪秒
五、怎么回事？
恩？眼睛花了？還是測試結果貼錯了？還是……？
一切都沒有錯！
2006年11月此書出版《JavaScript高級程序設計》在84-85頁，就是我上面的內容，我的測試結果卻和它的完全相反，技術的變革還是……？
我覺得是一個教訓！深刻的教訓！不知道哪看了這篇文章的人會有何感想。
JavaScript技術：JS 字符串連接[性能比較]，轉載需保留來源！
鄭重聲明：本文版權歸原作者所有，轉載文章僅為傳播更多信息之目的，如作者信息標記有誤，請第一時間聯系我們修改或刪除，多謝。
