1 如何進行字符串連接？
首先讓我們來回顧一下字符串連接的兩種常用方法：
1.1 使用字符串連接運算符
常用的語言（如Java、C#、PHP等）都有字符串連接運算符，Javascript也不例外，代碼示例：
var str = "";
str = str + "a";
1.2 使用數(shù)組
在常用的語言中，字符串連接運算的性能普遍不高，為此在C#中就專門提供了StringBuilder（Java中提供了StringBuffer）用于連接字符串。而在Javascript中就出現(xiàn)了通過Array模擬StringBuilder的方案。
var str = [];
for (var i = 0; i < 100; i++) {
str[i] = "12345";
}
str = str.join("");
2 測試
下面通過復制字符串的過程來測試兩種方法的性能：
2.1 通過字符串連接運算符進行復制：
function copyByOperator(str, times) {
var newStr = "";
for (var i = 0; i < times; i++) {
newStr += str;
}
return newStr;
}
2.2 通過數(shù)組進行復制：
function copyByArray(str, times) {
var newStr = [];
for (var i = 0; i < times; i++) {
newStr[i] = str;
}
return newStr.join("");
}
str采用一段固定的HTML字符串，長度是61。
2.3 IE下的測試
考慮到IE的性能比較差，先用小的times值（6000）在IE 6、IE 7和IE 8下面測試。運行10次后取平均值，結果如下：
IE瀏覽器下的測試結果| 瀏覽器 | copyByOperator | copyByArray |
|---|
| IE 6 | 1780.4ms | 9.5ms |
| IE 7 | 1754.6ms | 7.7ms |
| IE 8 | 1.6ms | 9.4ms |
IE6、7與IE8的測試結果相距甚遠，很明顯地，IE 8對字符串連接運算進行了優(yōu)化，效率已經(jīng)高于數(shù)組復制法。
2.4 各種瀏覽器下的測試
下面再用比較大的times值（50000）對最新版本的各種瀏覽器進行測試。
各種瀏覽器的測試結果| 瀏覽器 | copyByOperator | copyByArray |
|---|
| IE 8 | 21.8ms | 54.7ms |
| Firefox 3.6 | 40.9ms | 27.9ms |
| Chrome 4 | 4.4ms | 10.9ms |
| Safari 4.0.5 | 41.6ms | 34.6ms |
| Opera 10.50 | 33.1ms | 23ms |
這個結果真是出人意料。IE 8下的字符串連接運算竟然把Chrome以外的瀏覽器都打敗了，那些老說IE性能低下的可要注意點了。而在Chrome下也出現(xiàn)了字符串連接運算比數(shù)組復制法高效的情況。
3 總結
瀏覽器的性能在不斷地提高，作為前端工程師，也要適時調(diào)整Javascript程序的優(yōu)化策略，以獲得最佳的性能。
