JavaScript字符串拼接速度

Question

有人能解释一下这个吗：

http://jsperf.com/string-concatenation-1/2

如果你很懒，我测试了A)和B):

A)

var innerHTML = "";

items.forEach(function(item) {
    innerHTML += item;
});

B)

var innerHTML = items.join("");

两个测试中的items都是相同的500个字符串元素数组，每个字符串的长度随机在100到400个字符之间。

A) 最终比较快10倍。这是怎么回事——我一直以为使用join("")连接字符串是一种优化技巧。我的测试有什么问题吗？

- FoobarisMaximus

---

除非您正在连接大量字符串（“非常大”取决于浏览器），否则Array.Join比+慢。 - Mrchief

Answer 1

使用 join("") 是在 IE6 上组合大字符串时的一种优化技巧，以避免 O(n**2) 的缓冲区复制。但对于组合小字符串来说，O(n**2) 只会在数组开销很大时占主导地位，因此并不是巨大的性能优势。

现代解释器通过使用“依赖字符串”来解决这个问题。关于依赖字符串及其优缺点，请参见此mozilla bug。

基本上，现代解释器知道许多不同类型的字符串：

1. 字符数组
2. 另一个字符串的切片（子串）
3. 两个其他字符串的连接

这使得连接和子串操作的时间复杂度为 O(1)，但有时会保留过多的子串缓冲区，导致垃圾收集器效率低下或复杂度高。

一些现代解释器尝试将 (1) 进一步分解为 ASCII 字符串的 byte[]，以及包含不能适应一个字节的 UTF-16 代码单元的 uint16s 数组。但我不知道这个想法是否实际应用于任何解释器中。

- Mike Samuel

Answer 2

这里Lua编程语言的作者解释了Mike Samuel所说的缓冲开销。示例是用Lua编写的，但在JavaScript中问题是相同的。

- katspaugh