javascript中字符串拼接需注意的问题
更新时间：2010年07月13日 00:35:19 作者：
作为一名.net开发人员相信大家都知道C#中字符串拼接与StringBuilder的效率差距。
在开发中大家也都会注意尽量使用StringBuilder而不采用普通的字符串拼接方式。但是可能大部分开发者却忽略了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次字符串的性能测试，相信结果大家有目共睹，有兴趣的朋友可以自己测试一下。
所以 ，在前台开发中我们也应尽量避免大规模的字符串拼接操作，应采用数组方式来合理提高代码效率。
下面进行一项性能测试，用事实来说话！
复制代码 代码如下:
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次字符串的性能测试，相信结果大家有目共睹，有兴趣的朋友可以自己测试一下。
所以 ，在前台开发中我们也应尽量避免大规模的字符串拼接操作，应采用数组方式来合理提高代码效率。
相关文章
由于网络、浏览器问题、缓存等原因执行js的时候会抛出异常接下来分享一个想法，基本上涉及到两步：收集和使用，感兴趣的你可以参考下哈，希望对你有所帮助2013-03-03
这篇文章主要介绍了BootStrap创建响应式导航条实例代码的相关资料,需要的朋友可以参考下2016-05-05
这篇文章主要介绍了原生js和jquery分别实现横向导航菜单效果的相关资料，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-05-05
这篇文章主要介绍了Bootstrap实现默认导航栏效果，导航栏是一个很好的功能，是Bootstrap网站的一个突出特点，本文带领大家学习实现Bootstrap导航栏,需要的朋友可以参考下2015-12-12
这篇文章主要为大家详细介绍了Javascript技术栈中的四种依赖注入，感兴趣的小伙伴们可以参考一下2016-02-02
这篇文章主要介绍了webpack4之如何编写loader，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2019-06-06
这篇文章主要为大家详细介绍了JavaScript实现网页留言板功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2020-11-11
这篇文章主要为大家详细介绍了小程序实现列表点赞功能，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2018-11-11
这篇文章主要介绍了微信小程序动态添加和删除组件的现实，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-02-02
JavaScript 5 发布有一段时间了，Array 对象新增了很多方法。但在老版本的浏览器上还不能使用，得益于 JavaScript 的动态可扩展性，我实现了这些方法，在此晒出来与君共勉2012-02-02
最新评论