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