JS下高效拼装字符串的几种方法比较与测试代码
2023-06-13 09:14:17 时间
在使用Ajax提交信息时,我可能常常需要拼装一些比较大的字符串通过XmlHttp来完成POST提交。尽管提交这样大的信息的做法看起来并不优雅,但有时我们可能不得不面对这样的需求。那么JavaScript中对字符串的累加速度如何呢?我们先来做下面的这个实验。累加一个长度为30000的字符串。
测试代码1-耗时:14.325秒
复制代码代码如下:
测试代码1-耗时:14.325秒
varstr="";
for(vari=0;i<50000;i++){
str+="xxxxxx";
}
这段代码耗时14.325秒,结果并不理想。现在我们将代码改为如下的形式:
测试代码2-耗时:0.359秒
varstr="";
for(vari=0;i<100;i++){
varsub="";
for(varj=0;j<500;j++){
sub+="xxxxxx";
}
str+=sub;
}
这段代码耗时0.359秒!同样的结果,我们做的只是首先拼装一些较小的字符串然后再组装成更大的字符串。这种做法可以有效的在字符串拼装的后期减小内存复制的数据量。知道了这一原理之后我们还可以把上面的代码进一步拆散以后进行测试。下面的代码仅耗时0.140秒。
测试代码3-耗时:0.140秒
varstrArray=newArray();
for(vari=0;i<100;i++){
varsub="";
for(varj=0;j<500;j++){
sub+="xxxxxx";
}
strArray.push(sub);
}
str=String.prototype.concat.apply("",strArray);
不过,上面这种做法也许并不是最好的!如果我们需要提交的信息是XML格式的(其实绝大多数情况下,我们都可以设法将要提交的信息组装成XML格式),我们还能找能更高效更优雅的方法—利用DOM对象为我们组装字符串。下面这段代买组装一个长度为950015的字符串仅须耗时0.890秒。
利用DOM对象组装信息-耗时:0.890秒
varxmlDoc;
if(browserType==BROWSER_IE){
xmlDoc=newActiveXObject("Msxml.DOMDocument");
}
else{
xmlDoc=document.createElement("DOM");
}
varroot=xmlDoc.createElement("root");
for(vari=0;i<50000;i++){
varnode=xmlDoc.createElement("data");
if(browserType==BROWSER_IE){
node.text="xxxxxx";
}
else{
node.innerText="xxxxxx";
}
root.appendChild(node);
}
xmlDoc.appendChild(root);
varstr;
if(browserType==BROWSER_IE){
str=xmlDoc.xml;
}
else{
str=xmlDoc.innerHTML;
}
相关文章
- JS实现继承的几种方法总结
- JS 可编辑表格的实现
- 一些元素位置设置的通用JS方法详解编程语言
- js window.onload 加载多个函数的方法详解编程语言
- JS判断字符串是否包含某字符串 indexOf()方法使用详解编程语言
- JS exec()方法:执行正则表达式匹配
- JS indexOf()和lastIndexOf()方法:在数组中查找某个元素
- JS toString()方法:返回一个对象的字符串
- 妙用JS获取Oracle信息的快速方法(js获取Oracle)
- Js+DVML很酷漂亮实用的右键弹出菜单
- 控件开发时两种JS嵌入资源方式的使用方法
- 比较简单实用的使用正则三种版本的js去空格处理方法
- 用于判断用户注册时,密码强度的JS代码
- js正则表达式之RegExp对象之compile方法编译正则表达式
- JS实现Json查询的方法实例
- 前台js调用后台方法示例
- js数组去重的常用方法总结
- 用js正确判断用户名cookie是否存在的方法
- jquery插件lazyload.js延迟加载图片的使用方法
- node.js使用npm安装插件时提示installError:ENOENT报错的解决方法
- node.js中的fs.truncate方法使用说明
- 把js文件编译成dll供页面调用的方法
- js判断浏览器是否支持html5