数组方法解决JS字符串连接性能问题有争议


Posted in Javascript onJanuary 12, 2011

1、传统上,字符串连接一直是js中性能最低的操作之一。
var text="Hello";
text+=" World!";
早期浏览器没有对这种运算进行优化。
由于字符串是不可变的,这意味着要创建中间字符串来存储连接的结果。频繁地在后台创建和销毁字符串导制性能异常低下。
2、发现这一点后,开发者们利用数组对象进行优化。
var buffer=[],i=0;
buffer[i++]="Hello";//通过相应索引值添加元素比push方法快
buffer[i++]=" World!";
var text=buffer.join("");
在早期的浏览器中,没有创建和销毁中间字符串,在大量字符串连接情况下,这技术已被证明远快于使用加法方式。
3、如今浏览器对字符串的优化已经改变了字符串相连的局面。
Safari、Opera、Chrome、Firefox和IE8都在使用加法运算符上表现出了更好的性能。但是,IE8之前的版本没有优化,因此数组方法依然有效。
这并不意味着字符串相连时我们要进行浏览器检测。在决定如何连接时要考虑的是字符串的大小和数量。
1)当字符串相对较小(<20字符)且连接数量也较小时(<1000个),所有的浏览器使用加法运算符都能在不到1豪秒内轻松完成连接。
2)增加字符串数量或大小时,IE7中性能会明显下降。
3)字符串大小增加时,Firefox中加法运算符和数组成技巧性能差异会变小。
4)字符串数量增加时,Safari中加法运算符和数组成技巧性能差异会变小。
5)改变字符串数量或大小时,Chrome和Opera中加法运算符一直保持领先优势。
所以,由于在各浏览器下性能不一致,选用技术取决于实际情况和面对的浏览器。
大多数情况下,加法运算符是首选;如果用户主要使用IE6或7,并且字符串大小较大或数量较多时,那么数组技术就很值得。

Javascript 相关文章推荐
二叉树的非递归后序遍历算法实例详解
Feb 07 Javascript
javascript不同类型数据之间的运算的转换方法
Feb 13 Javascript
js实现进度条的方法
Feb 13 Javascript
jQuery.Highcharts.js绘制柱状图饼状图曲线图
Mar 14 Javascript
javascript数字验证的实例代码(推荐)
Aug 20 Javascript
Bootstrap源码解读下拉菜单(4)
Dec 23 Javascript
JQuery 获取多个select标签option的text内容(实例)
Sep 07 jQuery
初识 Vue.js 中的 *.Vue文件
Nov 22 Javascript
vuex的使用及持久化state的方式详解
Jan 23 Javascript
详解wepy开发小程序踩过的坑(小结)
May 22 Javascript
vue在路由中验证token是否存在的简单实现
Nov 11 Javascript
vue更改数组中的值实例代码详解
Feb 07 Javascript
js对数字的格式化使用说明
Jan 12 #Javascript
元素的内联事件处理函数的特殊作用域在各浏览器中存在差异
Jan 12 #Javascript
克隆javascript对象的三个方法小结
Jan 12 #Javascript
JavaScript中两种链式调用实现代码
Jan 12 #Javascript
Chrome中JSON.parse的特殊实现
Jan 12 #Javascript
js中将字符串转换成json的三种方式
Jan 12 #Javascript
Javascript在IE下设置innerHTML时出现未知的运行时错误的解决方法
Jan 12 #Javascript
You might like
php生成SessionID和图片校验码的思路和实现代码
2009/03/10 PHP
PHP 多维数组排序(usort,uasort)
2010/06/30 PHP
php使用MySQL保存session会话的方法
2015/06/26 PHP
HTTP头隐藏PHP版本号实现过程解析
2020/12/09 PHP
禁止F5等快捷键的JS代码
2007/03/06 Javascript
可以用来调试JavaScript错误的解决方案
2010/08/07 Javascript
jquery Mobile入门—外部链接切换示例代码
2013/01/08 Javascript
Javascript 颜色渐变效果的实现代码
2013/10/01 Javascript
js隐式全局变量造成的bug示例代码
2014/04/22 Javascript
jQuery实现表格行上下移动和置顶效果
2015/06/05 Javascript
JavaScript判断图片是否已经加载完毕的方法汇总
2016/02/05 Javascript
Node.js中JavaScript操作MySQL的常用方法整理
2016/03/01 Javascript
Node.js插件安装图文教程
2016/05/06 Javascript
node通过express搭建自己的服务器
2017/09/30 Javascript
jQuery实现鼠标点击处心形漂浮的炫酷效果示例
2018/04/12 jQuery
通过vue-cli3构建一个SSR应用程序的方法
2018/09/13 Javascript
vue项目中axios请求网络接口封装的示例代码
2018/12/18 Javascript
localstorage实现带过期时间的缓存功能
2019/06/28 Javascript
Webpack中loader打包各种文件的方法实例
2019/09/03 Javascript
JavaScript禁止右击保存图片,禁止拖拽图片的实现代码
2020/04/28 Javascript
使用Python求解最大公约数的实现方法
2015/08/20 Python
python中numpy基础学习及进行数组和矢量计算
2017/02/12 Python
Python使用win32com模块实现数据库表结构自动生成word表格的方法
2018/07/17 Python
python生成n个元素的全组合方法
2018/11/13 Python
python画柱状图--不同颜色并显示数值的方法
2018/12/13 Python
PyQt5 在label显示的图片中绘制矩形的方法
2019/06/17 Python
Python Websocket服务端通信的使用示例
2020/02/25 Python
Python解析微信dat文件的方法
2020/11/30 Python
Html5实现如何在两个div元素之间拖放图像
2013/03/29 HTML / CSS
html5本地存储 localStorage操作使用详解
2016/09/20 HTML / CSS
庆元旦活动总结
2014/07/09 职场文书
2014三年级班主任工作总结
2014/12/05 职场文书
2014年干部培训工作总结
2014/12/17 职场文书
父亲婚礼答谢词
2015/01/04 职场文书
利用ajax+php实现商品价格计算
2021/03/31 PHP
未发现nvidia显卡怎么办?Win11系统中未检测到nvidia显卡解决教程
2022/04/08 数码科技