JS编程建议——36：警惕字符串连接操作（1）

建议36：警惕字符串连接操作（1）
字符串连接表现出惊人的“性能紧张”。一个任务通过一个循环向字符串末尾不断地添加内容，以创建一个字符串。例如，创建一个HTML 表或一个XML 文档。此类处理在一些浏览器上表现得非常糟糕。
当连接少量字符串时，这些问题都可以忽略，临时使用可选择最熟悉的操作。当合并字符串的长度和数量增加之后，有些函数开始显示出“威力”。
（1）+、+=
+、+=运算符提供了连接字符串的最简单方法。除IE 7及其以前版本外，当前所有浏览器都对这种方法优化得很好，因此不需要使用其他方法。当然，还可以提高这些操作的效率。例如，下面这行代码是字符串连接的常用方法：

1. str += "one" + "two";
   JavaScript在执行这行代码时，会进行以下4个步骤：

第1步，在内存中创建一个临时字符串。
第2步，临时字符串的值被赋予“onetwo”。
第3步，临时字符串与str 的值进行连接。
第4步，把结果赋予str。
不过，通过下面代码进行优化能够提高执行效率：两个离散表达式直接将内容附加到str上，避免了临时字符串（第1 步和第2步）。在大多数浏览器中，这样做可以使执行速度提升10%～40%。

1. str += "one";
2. str += "two";
   实际上，也可以用以下一行代码实现同样的性能提升。
3. strstr = str + "one" + "two";
   这就避免了使用临时字符串，因为赋值表达式开头以str 为基础，一次追加一个字符串，从左至右依次连接。如果改变连接顺序，如下所示：
4. str = "one" + str + "two";
   就会失去这种优化性能。这与浏览器合并字符串时分配内存的方法有关。除IE以外，浏览器尝试扩展表达式左端字符串的内存，然后简单地将第二个字符串复制到它的尾部。在一个循环中，如果基本字符串位于最左端，就可以避免多次复制一个越来越大的基本字符串。

然而，上面的方法并不适用于IE。对于IE来说，这种优化几乎没有任何作用，在IE 8 上甚至比IE 7 和早期版本更慢，这与IE 执行连接操作的机制有关。
在IE 8 中，连接字符串只是记录下构成新字符串的各部分字符串的引用。在最后时刻，各部分字符串才被逐个复制到一个新的“真正的”字符串中，然后用它取代先前的字符串引用，因此并非每次使用字符串时都发生合并操作。
IE 7 和更早的浏览器在连接字符串时使用更糟糕的实现方法，每连接一对字符串都要将其复制到一块新分配的内存中。使用上述方法反而会使代码执行速度更慢，因为合并多个短字符串比连接一个大字符串更快，因此要避免多次复制那些大字符串。例如：

1. largeStrlargeStr = largeStr + s1 + s2;
   在IE 7 和更早的版本中，必须将这个大字符串复制两次。首先与s1 合并，然后再与s2 合并。相反，对于下面代码：
2. largeStr = s1 + s2;