[转载]javascript使用Array、join做字符存储和直接使用+号拼接字符串的执行效率比较 – bluescreen – 博客园.
因为最近在学习ASP.NET,其中也穿插着看点JavaScript.在学习过程也遇到一些问题和疑惑,就把当时的一些想法和测试结果记录下。如有不对之处还请各位大侠指正。谢谢!
在学习JavaScript时看了一本书(还没有看完)。而《JavaScript高级编程》这本书中说“使用Array做为StringBuffer,代替字符串拼接的操作。然后使用Array中的join方式处理要比直接进行字符串拼接效率要高。”然后下面就给出了相关例子。
其代码如下(函数名忘了什么,但是这样写的):
<script type="text/javascript"> function StringBuilder() { this.strings = new Array(); } StringBuilder.prototype.Append = function (str) { this.strings.push(str); }; StringBuilder.prototype.ToString = function () { return this.strings.join(""); }; </script>
经过测试代码的确可用并且感觉用着还不错,颇有C#中StringBuilder的感觉。但执行速度并未进行测试!
var str = new StringBuilder(); str.Append("你好"); str.Append("Hello") str.ToString();
由于用着比较好用,就想试着增加点其他功能。让它像C#中StringBuilder的一样多好,之后就增加了点方法。由于是新手,很多内容也不知 道如何处理,最终以失败而告终。所添加的方法全部按数组进行操作(插入,移除等),并没有字符的一些特性(由于没有达到自己想要的效果,代码就不贴了)。
第二天,不甘失败又重新修改下代码达到了自己想要的结果。但代码看上去不伦不类,有点多此几举的感觉。执行应该效率应该是不行的。不管执行效率是否如何, 由想到实现也是一点进步吧!对《javascript高级编程》提到的函数进行扩展(上面代码也给出),于是乎出现代码如下:
/* * javascript数组模拟C#中的StringBuilder * QQ:909507090 * http://www.qhjsw.net * * Copyright (c) 2012 www.qhjsw.net * * Date: 2012-02-10 14:25:16 * */ function StringBuilder() { this.strings = new Array(); } StringBuilder.prototype.Append = function (str) { this.strings.push(str); }; StringBuilder.prototype.ToString = function () { return this.strings.join(""); }; StringBuilder.prototype.Remove = function (value) { if (this.strings.length >= 1) { this.strings = this.strings.join("").split("").concat(); for (var i = 0; i < this.strings.length; i++) { if (this.strings[i] == value) { for (var j = i; j < (this.strings.length - 1); j++) { this.strings[j] = this.strings[j + 1]; } this.strings.length--; this.strings[this.strings.length] = null; this.strings.length--; break; } } } else { this.strings.length = 0; } }; StringBuilder.prototype.Insert = function (value, index) { if (index < 0) { index = 0; } this.strings = this.strings.join("").split("").concat(); if ((this.strings.length >= 1) && (index <= this.strings.length)) { for (var i = this.strings.length; i > index; i--) { this.strings[i] = this.strings[i - 1]; } this.strings[index] = value; this.strings.length++; } else { this.strings[0] = value; } }; StringBuilder.prototype.Exist = function (value) { if (this.strings.length > 1) { if (this.strings.join("").indexOf(value) != -1) { return true; } } return false; }; StringBuilder.prototype.Clear = function () { this.strings = this.strings.join("").split("").concat(); this.strings.length = null; }; StringBuilder.prototype.Length = function () { this.strings = this.strings.join("").split("").concat(); return this.strings.length; };
自己想做的东西出来了,现在却想测试一下执行效率如何。测试下执行效率是否入书中所说。测试是使用firefox+firebug,测试所用时间使 用firebug控制台自带计时。在要测试代码前后加入console.time()和console.timeEnd().使用三种方式做测试比较,测 试代码如下:
console.time("直接原始Array"); var str = new Array(); for (var i = 0; i < 10000; i++) { str.push(i); } var msg = str.join(""); console.timeEnd("直接原始Array"); console.time("使用书中提到的方法"); var str1 = new StringBuilder(); for (var i = 0; i < 10000; i++) { str1.Append(i); } str1.ToString(); console.timeEnd("使用书中提到的方法"); console.time("使用字符拼接+"); var str2 = ""; for (var i = 0; i < 10000; i++) { str2=str2+i; } console.timeEnd("使用字符拼接+");
进行多次测试。其测试代码内容无太大变化,主要更改循环的长度。测试结果如下表所示:
测试名称 | 10000次 | 100000次 | 1000000次 | 10000000次 | |
直接原始Array |
4ms | 38ms | 410ms | 4419ms | |
使用书中提到的方法 |
9ms | 86ms | 940ms | 9625ms | |
使用字符拼接+ |
5ms | 52ms | 629ms | 17724ms | |
测试截图 |
有以上测试结果可以很明显的看出用“直接原始Array和join”的执行效率是最快的,用书中提到到这个函数形式在 <=1000000的时候是最慢的。使用字符串拼接(+)的执行效率并不慢,在某些情况是可以忽略不计的。要说书中说的有误,也是不对的。书中的确 说:“使用Array做为StringBuffer,代替字符串拼接的操作。然后使用Array中的join方式处理要比直接进行字符串拼接效率要高。“.而书中给点函数的执行效率却不佳。很多程序时应该很少可以达到第三个测试点的循环次数!本来还想再加个测试,奈何浏览器不给力。测试到此结束!
现在自己感觉自己做了点无用功,做了扩展但以后却不想用了。1.效率问题的确是一点。2。对自己的扩展不满意(本想继续更改,但看到上面执行效率来看就不再做无用功了)