0

0

再论Javascript下字符串连接的性能_javascript技巧

php中文网

php中文网

发布时间:2016-05-16 18:09:46

|

1370人浏览过

|

来源于php中文网

原创

1 如何进行字符串连接?

首先让我们来回顾一下字符串连接的两种常用方法:
1.1 使用字符串连接运算符

常用的语言(如Java、C#、PHP等)都有字符串连接运算符,Javascript也不例外,代码示例:

复制代码 代码如下:

var str = "";
str = str + "a";

1.2 使用数组

在常用的语言中,字符串连接运算的性能普遍不高,为此在C#中就专门提供了StringBuilder(Java中提供了StringBuffer)用于连接字符串。而在Javascript中就出现了通过Array模拟StringBuilder的方案。
复制代码 代码如下:

var str = [];
for (var i = 0; i   str[i] = "12345";
}
str = str.join("");

2 测试

下面通过复制字符串的过程来测试两种方法的性能:
2.1 通过字符串连接运算符进行复制:
复制代码 代码如下:

function copyByOperator(str, times) {
  var newStr = "";
  for (var i = 0; i     newStr += str;
  }
  return newStr;
}

2.2 通过数组进行复制:
复制代码 代码如下:

function copyByArray(str, times) {
  var newStr = [];
  for (var i = 0; i     newStr[i] = str;
  }
  return newStr.join("");
}

str采用一段固定的HTML字符串,长度是61。
2.3 IE下的测试

考虑到IE的性能比较差,先用小的times值(6000)在IE 6、IE 7和IE 8下面测试。运行10次后取平均值,结果如下:
IE浏览器下的测试结果
浏览器 copyByOperator copyByArray
IE 6 1780.4ms 9.5ms
IE 7 1754.6ms 7.7ms
IE 8 1.6ms 9.4ms

IE6、7与IE8的测试结果相距甚远,很明显地,IE 8对字符串连接运算进行了优化,效率已经高于数组复制法

2.4 各种浏览器下的测试

下面再用比较大的times值(50000)对最新版本的各种浏览器进行测试。

各种浏览器的测试结果
浏览器 copyByOperator copyByArray
IE 8 21.8ms 54.7ms
Firefox 3.6 40.9ms 27.9ms
Chrome 4 4.4ms 10.9ms
Safari 4.0.5 41.6ms 34.6ms
Opera 10.50 33.1ms 23ms

这个结果真是出人意料。IE 8下的字符串连接运算竟然把Chrome以外的浏览器都打败了,那些老说IE性能低下的可要注意点了。而在Chrome下也出现了字符串连接运算比数组复制法高效的情况。

有道翻译AI助手
有道翻译AI助手

有道翻译提供即时免费的中文、英语、日语、韩语、法语、德语、俄语、西班牙语、葡萄牙语、越南语、印尼语、意大利语、荷兰语、泰语全文翻译、网页翻译、文档翻译、PDF翻

下载

3 总结

浏览器的性能在不断地提高,作为前端工程师,也要适时调整Javascript程序的优化策略,以获得最佳的性能。

相关文章

数码产品性能查询
数码产品性能查询

该软件包括了市面上所有手机CPU,手机跑分情况,电脑CPU,电脑产品信息等等,方便需要大家查阅数码产品最新情况,了解产品特性,能够进行对比选择最具性价比的商品。

下载

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

相关专题

更多
高德地图升级方法汇总
高德地图升级方法汇总

本专题整合了高德地图升级相关教程,阅读专题下面的文章了解更多详细内容。

4

2026.01.16

全民K歌得高分教程大全
全民K歌得高分教程大全

本专题整合了全民K歌得高分技巧汇总,阅读专题下面的文章了解更多详细内容。

3

2026.01.16

C++ 单元测试与代码质量保障
C++ 单元测试与代码质量保障

本专题系统讲解 C++ 在单元测试与代码质量保障方面的实战方法,包括测试驱动开发理念、Google Test/Google Mock 的使用、测试用例设计、边界条件验证、持续集成中的自动化测试流程,以及常见代码质量问题的发现与修复。通过工程化示例,帮助开发者建立 可测试、可维护、高质量的 C++ 项目体系。

10

2026.01.16

java数据库连接教程大全
java数据库连接教程大全

本专题整合了java数据库连接相关教程,阅读专题下面的文章了解更多详细内容。

33

2026.01.15

Java音频处理教程汇总
Java音频处理教程汇总

本专题整合了java音频处理教程大全,阅读专题下面的文章了解更多详细内容。

15

2026.01.15

windows查看wifi密码教程大全
windows查看wifi密码教程大全

本专题整合了windows查看wifi密码教程大全,阅读专题下面的文章了解更多详细内容。

42

2026.01.15

浏览器缓存清理方法汇总
浏览器缓存清理方法汇总

本专题整合了浏览器缓存清理教程汇总,阅读专题下面的文章了解更多详细内容。

7

2026.01.15

ps图片相关教程汇总
ps图片相关教程汇总

本专题整合了ps图片设置相关教程合集,阅读专题下面的文章了解更多详细内容。

9

2026.01.15

ppt一键生成相关合集
ppt一键生成相关合集

本专题整合了ppt一键生成相关教程汇总,阅读专题下面的的文章了解更多详细内容。

6

2026.01.15

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
Swoft2.x速学之http api篇课程
Swoft2.x速学之http api篇课程

共16课时 | 0.9万人学习

PHP基础入门课程
PHP基础入门课程

共33课时 | 1.9万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号