JS 字符串连接[性能比较]


Posted in Javascript onMay 10, 2009

一、ECMAScript的字符串是不可变的,即它们的值不能改变,因此当你写出下面的代码的时候发生了什么呢?
Js代码

var str = "Hello "; 
str += "world";

执行的步骤如下:
创建存储“Hello“的字符串
创建存储”world“的字符串
创建存储连接结果的字符串
把str的当前内容复制到结果中
把“world”复制到结果中
更新str,使它指向结果
每次完成字符串的连接都会执行步骤2-6,使得这种操作非常消耗资源。想象一下重复这个过程几百次,甚至几千次,那性能如何?
二、那么再看看下面的代码,来解决这种窘况
Js代码
var arr = new Array; 
arr[0] = "Hello "; 
arr[1] = "world"; 
var str = arr.join("");

执行的步骤如下:
创建存储结果的字符串
把每个字符串复制到结果中的适当位置
这样,无论数组要引入多少字符串都不成问题,因为只有在调用join()方法时候才会发生连接操作。
三、觉得操作很复杂?代码不能确切反应它的意图?那么我们用对象的解决方式吧,使它更容易理解,用StringBuffer类来封装该功能:
Js代码
function StringBuffer() { 
this._strs = new Array; 
} 
StringBuffer.prototype.append = function (str) { 
this._strs.push(str); 
}; 
StringBuffer.prototype.toString = function() { 
this._strs.join(""); 
};

好了,感受一下吧,现在如何操作字符串呢?
Js代码
var sb = new StringBuffer(); 
sb.append("Hello "); 
sb.append("world"); 
var result = sb.toString();

四、似乎色香味俱全了,但是吃下去的功效如何?
Js代码
var tStart = new Date(); 
var str = ""; 
for(var i=0;i<10000;i++) 
{ 
str += "text" 
} 
var tEnd = new Date(); 
document.write("原始的方法加号 拼接10000个字符串 花费时间:"+(tEnd.getTime()-tStart.getTime())+"秒"); 
var oSB = new StringBuffer(); 
tStart = new Date(); 
for(var i=0;i<10000;i++) 
{ 
oSB.append("text"); 
} 
var sRst = oSB.toString(); 
tEnd = new Date(); 
document.write("<br/>StringBuffer 拼接10000个字符串 花费时间:"+(tEnd.getTime()-tStart.getTime())+"秒");

可能你已经猜到了,StringBuffer要比+快,到底快多少呢?我的测试结果:
Js代码
FF3.0.10
原始的方法加号 拼接10000个字符串 花费时间:3豪秒
StringBuffer 拼接10000个字符串 花费时间:8豪秒
IE7
原始的方法加号 拼接10000个字符串 花费时间:15豪秒
StringBuffer 拼接10000个字符串 花费时间:16豪秒
IE8
原始的方法加号 拼接10000个字符串 花费时间:15豪秒
StringBuffer 拼接10000个字符串 花费时间:16豪秒
Chrome1.0.154.46
原始的方法加号 拼接10000个字符串 花费时间:1豪秒
StringBuffer 拼接10000个字符串 花费时间:2豪秒
五、怎么回事?
恩?眼睛花了?还是测试结果贴错了?还是……?
一切都没有错!
2006年11月此书出版《JavaScript高级程序设计》在84-85页,就是我上面的内容,我的测试结果却和它的完全相反,技术的变革还是……?
我觉得是一个教训!深刻的教训!不知道哪看了这篇文章的人会有何感想。
Javascript 相关文章推荐
javascript引用对象的方法代码
Aug 13 Javascript
Auntion-TableSort国人写的一个javascript表格排序的东西
Nov 12 Javascript
JavaScript Event学习第九章 鼠标事件
Feb 08 Javascript
javascript下利用arguments实现string.format函数
Aug 24 Javascript
简短几句 通俗解释javascript的闭包
Jan 17 Javascript
Javascript实现真实字符串剩余字数提示的实例代码
Oct 22 Javascript
jquery获取URL中参数解决中文乱码问题的两种方法
Dec 18 Javascript
基于MVC5和Bootstrap的jQuery TreeView树形控件(二)之数据支持json字符串、list集合
Aug 11 Javascript
javascript中递归的两种写法
Jan 17 Javascript
简单的vue-resourse获取json并应用到模板示例
Feb 10 Javascript
Node.js的Koa实现JWT用户认证方法
May 05 Javascript
vue实现井字棋游戏
Sep 29 Javascript
javascript获取当前ip的代码
May 10 #Javascript
&amp;lt;script defer&amp;gt; defer 是什么意思
May 10 #Javascript
extjs fckeditor集成代码
May 10 #Javascript
一组JS创建和操作表格的函数集合
May 07 #Javascript
给Function做的OOP扩展
May 07 #Javascript
js arguments.callee的应用代码
May 07 #Javascript
javascript 有用的脚本函数
May 07 #Javascript
You might like
PHP实现用户认证及管理完全源码
2007/03/11 PHP
PHP 函数执行效率的小比较
2010/10/17 PHP
比较时间段一与时间段二是否有交集的php函数
2011/05/31 PHP
php+mysql实现无限级分类
2015/11/11 PHP
php 获取xml接口数据的处理方法
2018/05/31 PHP
PHP实现文件上传与下载
2020/08/28 PHP
设置下载不需要倒计时cookie(倒计时代码)
2008/11/19 Javascript
用json方式实现在 js 中建立一个map
2014/05/02 Javascript
微信小程序 UI布局常用技巧整理总结
2016/12/05 Javascript
javascript中的深复制详解及实例分析
2016/12/29 Javascript
解决BootStrap Fileinput手机图片上传显示旋转问题
2017/06/01 Javascript
jsonp跨域请求详解
2017/07/13 Javascript
原生js基于canvas实现一个简单的前端截图工具代码实例
2019/09/10 Javascript
vue项目创建步骤及路由router
2020/01/14 Javascript
Postman如何实现参数化执行及断言处理
2020/07/28 Javascript
[05:20]卡尔工作室_DOTA2新手教学_DOTA2超强新手功能
2013/04/22 DOTA
[02:30]DOTA2英雄基础教程 暗影恶魔
2013/12/17 DOTA
[41:11]完美世界DOTA2联赛PWL S2 Inki vs Magma 第一场 11.22
2020/11/24 DOTA
Python的Flask框架中SQLAlchemy使用时的乱码问题解决
2015/11/07 Python
Python3安装Pymongo详细步骤
2017/05/26 Python
Python使用pip安装报错:is not a supported wheel on this platform的解决方法
2018/01/23 Python
Python wxpython模块响应鼠标拖动事件操作示例
2018/08/23 Python
Python发送手机动态验证码代码实例
2020/02/28 Python
Java Spring项目国际化(i18n)详细方法与实例
2020/03/20 Python
学会python自动收发邮件 代替你问候女友
2020/05/20 Python
python怎么判断模块安装完成
2020/06/19 Python
Python工程师必考的6个经典面试题
2020/06/28 Python
Django封装交互接口代码
2020/07/12 Python
canvas进阶之贝塞尔公式推导与物体跟随复杂曲线的轨迹运动
2018/01/10 HTML / CSS
德国最大的网上鞋店之一:Schuhe24.de
2017/06/10 全球购物
户外活动总结范文
2014/04/30 职场文书
物业总经理助理岗位职责
2014/06/29 职场文书
工作检讨书范文
2015/01/23 职场文书
婚宴父亲致辞
2015/07/27 职场文书
css 边框添加四个角的实现代码
2021/10/16 HTML / CSS
vue router 动态路由清除方式
2022/05/25 Vue.js