JavaScript中字符串连接性能

看到很多书或文章中都有说在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如何。)

JavaScript中字符串连接性能》上有33条评论

    1. 流年 文章作者

      @BoKeam, 这里纯粹是比较一下两种方法的性能而已

      回复
    1. 流年 文章作者

      @BoKeam, 有人说过需要强行刷新才可以看到回复,不过我这里倒没问题。(嗯,用了object-cache)

      回复
  1. snowxh

    你现在在我的文章页还loading么 我自己的chrome是没事了
    但ie要没完没了的loading 气死我了 😯

    回复
    1. 流年 文章作者

      @snowxh, 上次忘记说了,那个问题应该是我的问题(chrome升级不完全 ➡ );果然IE下没完没了

      回复
      1. snowxh

        @流年, 升级不完全- – 升到一半停了么- -。
        话说的的留言缓存问题变严重了…
        之前是邮件过来看不到你的回复强刷一下 现在变成连自己的留言也看不到了……

        回复
    1. 流年 文章作者

      @zwwooooo, 嗯,有些书更新的时候都没有去验证一下

      回复
    1. 流年 文章作者

      @Ygs, 没办法,毕竟IE的升级换代比别的慢很多,所以,对于新技术的应用、新标准的应用就慢别人很多了

      回复
  2. 人好哇!

    IE9的JS性能会很大的提升的,但是还是比不上FF和Chrome,但是至少是一个数量级的差距了~而不是几个数量级!

    回复

发表评论

电子邮件地址不会被公开。 必填项已用*标注