javascript中String Concat和StringBuilder类的性能比较

过年无聊写了一个Javascript中的类StringBuilder来连接字符串,并将其与String Concat进行了一下性能比较

测试脚本如下代码:

ContractedBlock.gif ExpandedBlockStart.gif Code
 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
 2 <html>
 3     <head>
 4         <title>JavaScript StringBuilder</title>
 5         <script src="StringBuilder.js" type="text/javascript"></script>
 6         <script type="text/javascript">
 7         <!--
 8             function runTests()
 9             {
10                 // string concat test
11                 var s = new String();
12                 
13                 var startTime = new Date();
14                 
15                 for (var i = 1; i < 5001; i++)
16                 {
17                     s += i + " Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat.<br>";
18                 }
19                 
20                 var concatResult = s;
21                 
22                 var endTime = new Date();
23                 var concatTime = endTime - startTime;
24                 
25                 // StringBuilder test
26                 var sb = new StringBuilder();
27                 
28                 startTime = new Date();
29                 
30                 for (var i = 1; i < 5001; i++)
31                 {
32                     sb.append(i);
33                     sb.append(" Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat.<br>");
34                 }
35                 
36                 var sbResult = sb.toString();
37                 
38                 endTime = new Date();
39                 var sbTime = endTime - startTime;
40                 
41                 document.writeln("String concat test complete.  Total process time <b>" + concatTime + "</b> ms.<br>");
42                 document.writeln("StringBuilder test complete.  Total process time <b>" + sbTime + "</b> ms.<br>");
43                 document.writeln("Resulting strings are " + ((concatResult == sbResult) ? "" : "NOT "+ "identical.<br>");
44                 document.writeln("<br><b>String concat results:</b><br>");
45                 document.writeln(concatResult);
46                 document.writeln("<br><b>StringBuilder results:</b><br>");
47                 document.writeln(sbResult);                
48             }
49             
50             function button_click()
51             {
52                 document.body.innerHTML = "Running tests";
53                 window.setTimeout(runTests, 0);
54             }
55         //-->
56         </script>
57     </head>
58     <body>
59         <form>
60             <input type="button" value="Click me to run tests" onclick="button_click();">
61         </form>
62     </body>
63 </html>
64 

自定义的StringBuilder类如下:

ContractedBlock.gif ExpandedBlockStart.gif Code
 1 function StringBuilder(value)
 2 {
 3     this.strings = new Array("");
 4     this.append(value);
 5 }
 6 
 7 // Appends the given value to the end of this instance.
 8 StringBuilder.prototype.append = function (value)
 9 {
10     if (value)
11     {
12         this.strings.push(value);
13     }
14 }
15 
16 // Clears the string buffer
17 StringBuilder.prototype.clear = function ()
18 {
19     this.strings.length = 1;
20 }
21 
22 // Converts this instance to a String.
23 StringBuilder.prototype.toString = function ()
24 {
25     return this.strings.join("");
26 }

 

本类中使用了prototype方法,此方法比较在类中定义方法,可以减少内存开销,因为prototype方式原理上就是

对象的浅拷贝,在内存中只使用对象的副本。

StringBuilder.js

 我们可以从以下的测试结果看出此两种方法的性能差距还是非常大的。

String concat test complete. Total process time 3950 ms.
StringBuilder test complete. Total process time 47 ms.
Resulting strings are identical.

 希望此方法能帮助做javascript的朋友解决一些性能上的问题。

 

 

转载于:https://www.cnblogs.com/adam/archive/2009/02/01/1382116.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值