阅读量:0
在JavaScript中，使用
+操作符连接字符串性能较好，避免使用+=和Array.join()。在Javascript中，字符串连接的性能问题一直是开发者关注的焦点，本文将详细讨论JavaScript下字符串连接的性能优化技巧。
浏览器对字符串连接的优化
早期浏览器没有对字符串连接进行优化，导致其成为性能较低的操作之一，由于字符串是不可变的，这意味着要创建中间字符串来存储连接的结果。
var text = "hello"; text += " "; text += "world!";
上述代码需要经过以下几个步骤：
1、创建存储"hello"的字符串。
2、创建存储" "的字符串。
3、创建存储"world!"的字符串。
4、创建存储连接结果的字符串。
5、把str的当前内容复制到结果中。
6、把"world"复制到结果中。
7、更新str，使它指向结果。
频繁地在后台创建和销毁字符串会导致字符串连接的性能异常低下，不过，如今大部分主流浏览器已经对字符串连接进行了优化，第一款进行优化的浏览器是Firefox，从1.0版本开始，在所有情况下使用数组技术实际上都比使用加法运算符慢，其他浏览器如Safari、Opera、Chrome和Internet Explorer8也都在使用加法运算符上表现出了更好的性能。
使用Array对象优化字符串连接
在浏览器还未对字符串连接性能进行优化之前，可以使用Array对象来改进其性能，方法如下：
function StringBuffer(){ this._strings = new Array(); } StringBuffer.prototype.append = function(str){ this._strings.push(str); } StringBuffer.prototype.toString = function(){ return this._strings.join(""); }这样，无论在数组中引入多少字符串都不成问题，因为只有在调用join()方法时才会发生连接操作，此时步骤如下：
1、创建存储结果的数组。
2、把每个字符串复制到结果中的合适位置。
3、将数组合并成字符串返回。
性能比较
采用上述方法，在Firefox 3.6中以及IE 8中，性能其实比直接用加法运算符（+）效率要低，在IE 8之前版本的IE浏览器中，采用这种方法连接字符串，性能比直接用加法运算符（+）有很大的提高，大概是60%左右（也就是花费的时间为原来的1/3左右）。
相关建议
Nicholas C. Zakas建议，需要考虑两个因素：（1）被连接的字符串大小（2）数量，当字符串较小（少于20个字符）且连接的数量也较小时（少于1000个），所有的浏览器中使用的加法运算符都能在不到1毫秒之内轻松完成连接，在这种情况下就没有理由去考虑加法运算符以外的方式了，增加连接字符串的数量或大小时，在IE 7中性能会明显下降，当字符串大小增加时，在Firefox中加法运算符和数组技术的性能差异会变小，当字符串连接数量增加时，在Safari中这两种技术的新能差异也同样会变小，只有Chrome和Opera在改变连接字符串的大小和数量时，加法运算符一直保持着显著的性能优势。
相关问题与解答
1、为什么早期的JavaScript中字符串连接性能较低？
回答：早期的JavaScript中字符串连接性能较低是因为字符串是不可变的，这意味着要创建中间字符串来存储连接的结果，每一次的字符串+都需要完成创建新字符串、复制内容和更新引用等步骤，这种消耗在庞大的数据基数下是不可忽视的。
2、如何优化JavaScript中的字符串连接性能？
回答：可以通过使用Array对象来优化JavaScript中的字符串连接性能，具体方法是创建一个StringBuffer类，通过append方法将字符串添加到数组中，最后通过join方法将数组中的字符串连接起来，这种方法在未优化的浏览器中性能较好，但在现代浏览器中可能不如直接使用加法运算符高效。
了解JavaScript中字符串连接的性能影响和不同的优化方法可以帮助开发者编写更高效、更流畅的代码，对于大型应用或性能敏感的场景，合理选择字符串连接方式是提高程序运行效率的关键。
以上内容就是解答有关“再论Javascript下字符串连接的性能-javascript技巧”的详细内容了，我相信这篇文章可以为您解决一些疑惑，有任何问题欢迎留言反馈，谢谢阅读。
