JS 字符串连接[性能比较]
2009-05-10 00:00
701 查看
一、ECMAScript的字符串是不可变的,即它们的值不能改变,因此当你写出下面的代码的时候发生了什么呢?
Js代码
执行的步骤如下:
创建存储“Hello“的字符串
创建存储”world“的字符串
创建存储连接结果的字符串
把str的当前内容复制到结果中
把“world”复制到结果中
更新str,使它指向结果
每次完成字符串的连接都会执行步骤2-6,使得这种操作非常消耗资源。想象一下重复这个过程几百次,甚至几千次,那性能如何?
二、那么再看看下面的代码,来解决这种窘况
Js代码
执行的步骤如下:
创建存储结果的字符串
把每个字符串复制到结果中的适当位置
这样,无论数组要引入多少字符串都不成问题,因为只有在调用join()方法时候才会发生连接操作。
三、觉得操作很复杂?代码不能确切反应它的意图?那么我们用对象的解决方式吧,使它更容易理解,用StringBuffer类来封装该功能:
Js代码
好了,感受一下吧,现在如何操作字符串呢?
Js代码
四、似乎色香味俱全了,但是吃下去的功效如何?
Js代码
可能你已经猜到了,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页,就是我上面的内容,我的测试结果却和它的完全相反,技术的变革还是……?
我觉得是一个教训!深刻的教训!不知道哪看了这篇文章的人会有何感想。
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页,就是我上面的内容,我的测试结果却和它的完全相反,技术的变革还是……?
我觉得是一个教训!深刻的教训!不知道哪看了这篇文章的人会有何感想。
相关文章推荐
- JS 字符串连接[性能比较]
- JS中三种字符串连接方式及其性能比较
- JS中三种字符串连接方式及其性能比较
- 浅谈JS中的三种字符串连接方式及其性能比较
- JS中三种字符串连接方式及其性能比较
- 数组方法解决JS字符串连接性能问题有争议
- 比较javascript两种字符串连接的性能
- Java各种字符串连接方法性能比较
- StringBuffer对象和传统的字符串连接方法性能测试比较
- 字符串连接方式性能比较
- 【Java性能】你需要知道的:Java字符串连接使用"+"和StringBuilder性能比较
- 关于 JS的 StringBuffer 和 + 拼接字符串性能的比较 案例 对《JavaScript高级程序设计》在84-85页 的测试
- 数组方法解决JS字符串连接性能问题有争议
- Java五种字符串连接的性能比较
- 提高js字符串连接的性能
- 从一道编程题看JS字符串连接性能
- 案例-js-模块化创建dom与字符串创建dom的耗时比较(性能优化)
- Python 字符串操作(string替换、删除、截取、复制、连接、比较、查找、包含、大小写转换、分割等)
- 小议 js 下字符串比较大小
- String类的split()方法与StringTokenizer方法对字符串分割并输出内容的性能比较