Javascript中的长字符串拼接

开发 前端
本文介绍的是Javascript中的长字符串拼接,希望对你有帮助,一起来看。

字符串拼接是所有程序设计语言都需要的操作。当拼接结果较长时,如何保证效率就成为一个很重要的问题。

C 语言的 strcat 函数直接操作内存,效率自然最高;C++ 的 string 类是可变的,本质上也是直接操作内存,效率也不在话下;Java 的 String 类不可变,字符串拼接意味着产生新对象,因此提供了专门用于字符串拼接的 StringBuffer 类,也保证了执行效率。

在 Javascript 中,大规模的字符串拼接虽不常见,但也并非没有。

在这种情况下,传统的字符串拼接会比较慢:

 

  1. <script>   
  2. function strcat1(count, substr) //将 count 个 substr 拼接在一起  
  3. {  
  4. var result = "";  
  5. for (var i = 0; i < count; ++i)  
  6. {  
  7. result += substr;  
  8. }  
  9. return result;  
  10. }  
  11. var begin = new Date();  
  12. strcat1(10000, "substr");   
  13. var end = new Date();  
  14. alert(end.valueOf() - begin.valueOf());  
  15. </script> 

 

在笔者的机器上(下同)这段代码要执行 3 秒钟。有没有比较快的拼接方法?答案是肯定的,Javascript 也提供了一个类似 StringBuffer 的东西,那就是数组:

 

  1. <script>   
  2. function strcat2(count, substr)  
  3. {  
  4. var buffer = [];  
  5. for (var i = 0; i < count; ++i)  
  6. {  
  7. buffer.push(substr);  
  8. }  
  9. return buffer.join("");  
  10. }  
  11. var begin = new Date();  
  12. strcat2(10000, "substr");   
  13. var end = new Date();  
  14. alert(end.valueOf() - begin.valueOf());  
  15. </script> 

 

这段代码只需执行 80 毫秒左右,比传统的字符串拼接快了数十倍。这是针对大规模的字符串拼接而言。对于小规模的字符串拼接,我们可以比较一下两种拼接方法的效率:

 

  1. <script>  
  2. function strcat1(count, substr)  
  3. {  
  4. var result = "";  
  5. for (var i = 0; i < count; ++i)  
  6. {  
  7. result += substr;  
  8. }  
  9. return result;  
  10. }  
  11. function strcat2(count, substr)  
  12. {  
  13. var buffer = [];  
  14. for (var i = 0; i < count; ++i)  
  15. {  
  16. buffer.push(substr);  
  17. }  
  18. return buffer.join("");  
  19. }  
  20. function test(strcat)  
  21. {  
  22. var substr = "substr";  
  23. var begin = new Date();  
  24. for (var i = 0; i < 1000; ++i)  
  25. {  
  26. strcat(10, substr);  
  27. }  
  28. var end = new Date();  
  29. return end.valueOf() - begin.valueOf();  
  30. }  
  31. alert(test(strcat1) + "," + test(strcat2));  
  32. </script> 

 

这一轮是传统的拼接方式胜出,其速度大约是数组方式的两倍多。可以验证,拼接的次数越少,传统的拼接方式优势越大。因此,在大规模的拼接中,如果混用传统拼接方法和数组拼接方法,速度会更快:

 

  1. <script>   
  2. function strcat3(count, substr)  
  3. {  
  4. var buffer = [];  
  5. count /= 5;  
  6. for (var i = 0; i < count; ++i)  
  7. {  
  8. buffer.push(substr + substr + substr + substr + substr);  
  9. }  
  10. return buffer.join("");  
  11. }  
  12. var begin = new Date();  
  13. strcat3(10000, "substr");   
  14. var end = new Date();  
  15. alert(end.valueOf() - begin.valueOf());  
  16. </script> 

 

这次只需执行 30 毫秒了。因此,笔者推荐以数组方式为主,适当辅以传统方式来拼接长字符串。下面是一个实例:

 

  1. <script>   
  2. function doLoad()  
  3. {  
  4. var buffer = ["<table style='width:100%' border=1>"];  
  5. for (var i = 0; i < 100; ++i)  
  6. {  
  7. buffer.push("<tr>");  
  8. for (var j = 0; j < 20; ++j)  
  9. {  
  10. buffer.push("<td>" + i + "," + j + "</td>");  
  11. }  
  12. buffer.push("</tr>");  
  13. }  
  14. buffer.push("</table>");  
  15. document.body.innerHTML = buffer.join("");  
  16. }  
  17. </script>  
  18. <body onload="doLoad()"></body> 

说明:

1、传统方式与数组方式会有以上差别的原因在于:传统方式拼接 n 个字符串的时间复杂度为 O(n^2),但系数较小;数组方式的时间复杂度为 O(n),但系数较大。

2、以上代码在 IE6 中调试通过。

希望本文能够给你带来帮助。

 

责任编辑:于铁 来源: 互联昂网
相关推荐

2011-07-11 15:36:44

JavaScript

2019-12-25 15:41:50

JavaScript程序员编程语言

2022-11-25 07:53:26

bash脚本字符串

2020-09-03 10:13:49

JavaScript字符串pad

2015-06-09 14:43:36

javascript操作字符串

2013-06-24 15:16:29

Java字符串拼接

2019-02-27 09:08:20

Java 8StringJoineIDEA

2021-05-31 07:57:00

拼接字符串Java

2020-10-16 18:35:53

JavaScript字符串正则表达式

2022-12-15 16:23:32

JavaScrip字符串开发

2021-06-11 18:08:00

Java字符串拼接

2021-10-31 23:01:50

语言拼接字符串

2017-01-19 11:26:55

Java 8StringBuild

2010-10-09 11:43:10

MYSQL字符串

2021-12-10 08:17:48

字符串拼接场景

2023-10-31 18:57:02

Java字符串

2016-12-27 09:46:55

Java 8StringBuild

2011-07-18 13:34:44

SQL Server数拼接字符串

2020-08-01 16:19:13

JavaScript字符串开发

2016-12-09 15:01:08

苹果激活锁字符串
点赞
收藏

51CTO技术栈公众号