JavaScript 大规模字符串拼接性能优化：避免直接使用 + 运算符

JavaScript 字符串拼接性能测试

在软件开发中，开发者通常倾向于使用 StringBuilder 而非普通的字符串拼接方式来处理文本，以优化性能。然而，许多 JavaScript 开发者往往忽视了这一效率问题在 JS 环境下的适用性。

为了验证这一观点，下面进行一项性能测试，用实际数据说明问题。

 
function xntest(){
var d1=new Date();
var str="";
for(var i=0;i<10000;i++){
str+="stext";
} 
var d2=new Date();
document.write("字符串拼接方式耗时："+(d2.getTime()- d1.getTime())+"毫秒；");
d1=new Date();
var sb=new StringBuilder();
for(var i=0;i<10000;i++){
sb.append("stext");
} 
var result=sb.toString();
d2=new Date();
document.write("数组方式耗时："+(d2.getTime()- d1.getTime())+"毫秒；");
} 
/////利用Array实现的字符串拼接函数，为方便c#开发者特意取名StringBuilde以便于理解
function StringBuilder(){
this._strings_=new Array;
} 
StringBuilder.prototype.append=function(str){
this._strings_.push(str);
}; 
StringBuilder.prototype.toString=function(){
return this._strings_.join("");
}; 

三次执行 xntest()函数后的结果为：

字符串拼接方式耗时：735毫秒；数组方式耗时：62毫秒；

字符串拼接方式耗时：766毫秒；数组方式耗时：63毫秒；

字符串拼接方式耗时：703毫秒；数组方式耗时：63毫秒；

此例是拼接10000次字符串的性能测试，相信结果大家有目共睹，有兴趣的朋友可以自己测试一下。

所以 ，在前台开发中我们也应尽量避免大规模的字符串拼接操作，应采用数组方式来合理提高代码效率。