看到很多书或文章中都有说在JavaScript中进行字符串连接时最好使用Array的join而不是字符串的“+”操作。因为,join的性能更好,速度更快,可我使用以下代码测试时却得到相反的结果。

Demo页面

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
/* cost time when using '+' */
document.write("<h4>using '+'</h4>");
var avg = 0;
for (var t=0; t < 10; t++){
    var d1 = new Date();
    var str = "";
    for (var i=0; i < 100000; i++) {
        str += "text";
    }
    var d2 = new Date();
    avg += d2.getTime() - d1.getTime();
    document.write(d2.getTime() - d1.getTime() + " ");
}
document.write("<br />AVG: " + avg/10);
   
/* cost time when using 'array join' */
document.write("<h4>using 'array join'</h4>");
var avg = 0;
for (var t=0; t < 10; t++){
    var arr = new Array;
    d1 = new Date();
    for (var i=0; i < 100000; i++){
        arr.push("text");
    }
    var res = arr.join("");
    d2 = new Date();
    avg += d2.getTime() - d1.getTime();
    document.write(d2.getTime() - d1.getTime() + " ");
}
document.write("<br />AVG: " + avg/10);

无论在IE 8还是Firefox、chrome等浏览器中都是后者耗时长。

后来查询了一下发现,+=比Array的join耗时长的说法是针对IE 6/7而言的,因为其垃圾收集机制不一样,每次重新分配内存后都要进行垃圾收集。这一问题在IE 8中得以解决。(小小说一下,IE 系类的JS引擎果然比别的落后很多,耗时都比别人的高一个数量级,不知道IE 9如何。)