从数据结构分析看:用for each...in 比 for...in 要快些


Posted in Javascript onApril 17, 2013

之前听说火狐的JS引擎支持for each in的语法,例如下述的代码:

var arr = [10,20,30,40,50];
for each(var k in arr)
    console.log(k);

即可直接遍历出arr数组的内容。

由于只有FireFox才支持,所以几乎所有的JS代码都不用这一特征。

不过在ActionScript里天生就支持for each的语法,不论Array还是Vector,还是Dictionary,只要是可枚举的对象都可以for in和for each in。

之前并没有感觉有太大的差异,为了懒得敲一个each单词,一直用熟悉的for in来遍历。

不过今天仔细琢磨了会,从数据结构的角度分析了下,觉得for in和for each in效率上有着本质的区别,无论是JS还是AS。

原因很简单:Array不是真正意义上的数组!

何为真正意义的数组?当然就是传统语言里type[]定义的数据类型,所有元素都是连续保存的。

“Array”虽然也是数组的意思,但熟悉JS的都知道,它其实是个非线性的伪数组,下标可以是任意数字。写入arr[1000000]并非真正申请容纳一百万个元素的空间,而是把1000000转换成相应的哈希值,对应到很小一块储存空间里,从而节省了大量内存。

例如有如下数组:

var arr = [];
  arr[10] = 1000;
  arr[20] = 2000;
  arr[30] = 5000;
  arr[40] = 8000;
  arr[200] = 9000;

用for...in遍历Array,是个很累赘的过程:

从数据结构分析看:用for each...in 比 for...in 要快些

遍历时每次访问arr[k],都要进行一次Hash(k)计算,根据散列表的容量取模,最终在冲突链表里找到结果。

如果支持for each...in的语法,其内部的数据结构就决定了会快很多:

从数据结构分析看:用for each...in 比 for...in 要快些

Array里储存存了keys的列表,也把每个values值作为链表关联起来。每当有值添加或删除,就更新其链接关系。

当for each...in遍历时,只需从第一个节点往后迭代即可,无需任何Hash计算。

当然,对于AS3里Vector这样的线性数组来说,两者相差不大;同理,HTML5里支持二进制的数组ArrayBuffer也是如此。不过从理论上来看,即使arr是个连续的线性数组,for each in还是要快一点:

for...in遍历时,每次访问arr[k]都要进行下标越界检查;而for each in则根据内部链表,直接从底层反馈出迭代变量,节省了越界检查的过程。

Javascript 相关文章推荐
js/jquery解析json和数组格式的方法详解
Jan 09 Javascript
jQuery元素选择器用法实例
Dec 23 Javascript
jQuery老黄历完整实现方法
Jan 16 Javascript
Javascript 是你的高阶函数(高级应用)
Jun 15 Javascript
JavaScript实现节点的删除与序号重建实例
Aug 05 Javascript
js点击按钮实现带遮罩层的弹出视频效果
Dec 19 Javascript
JavaScript reduce和reduceRight详解
Oct 24 Javascript
jquery实现拖动效果(代码分享)
Jan 25 Javascript
JS ES6中setTimeout函数的执行上下文示例
Apr 27 Javascript
js 中rewrap-ajax.js插件实例代码
Oct 20 Javascript
小程序实现上传视频功能
Aug 18 Javascript
基于vue的video播放器的实现示例
Feb 19 Vue.js
关于eval 与new Function 到底该选哪个?
Apr 17 #Javascript
js实现在页面上弹出蒙板技巧简单实用
Apr 16 #Javascript
主页面中的两个iframe实现鼠标拖动改变其大小
Apr 16 #Javascript
拖动table标题实现改变td的大小(css+js代码)
Apr 16 #Javascript
获取offsetTop和offsetLeft值的js代码(兼容)
Apr 16 #Javascript
jquery表格内容筛选实现思路及代码
Apr 16 #Javascript
js实现图片轮换效果代码
Apr 16 #Javascript
You might like
PHP生成Flash动画的实现代码
2010/03/12 PHP
PHPCMS忘记后台密码的解决办法
2016/10/30 PHP
php从身份证获取性别和出生年月
2017/02/09 PHP
使用php实现网站验证码功能【推荐】
2017/02/09 PHP
通过JavaScript控制字体大小的代码
2011/10/04 Javascript
总结JavaScript设计模式编程中的享元模式使用
2016/05/21 Javascript
Node.js connect ECONNREFUSED错误解决办法
2016/09/15 Javascript
jquery实现拖动效果(代码分享)
2017/01/25 Javascript
微信小程序 动态的设置图片的高度和宽度详解及实例代码
2017/02/24 Javascript
基于cookie实现zTree树刷新后展开状态不变
2017/02/28 Javascript
javascript 的变量、作用域和内存问题
2017/04/19 Javascript
bootstrap Table服务端处理分页(后台是.net)
2017/10/19 Javascript
JavaScript实现tab栏切换效果
2020/03/16 Javascript
Python松散正则表达式用法分析
2016/04/29 Python
Python处理CSV与List的转换方法
2018/04/19 Python
Python3实现获取图片文字里中文的方法分析
2018/12/13 Python
Python实现 PS 图像调整中的亮度调整
2019/06/28 Python
Python3 执行Linux Bash命令的方法
2019/07/12 Python
Python递归函数 二分查找算法实现解析
2019/08/12 Python
使用python制作游戏下载进度条的代码(程序说明见注释)
2019/10/24 Python
关于tf.nn.dynamic_rnn返回值详解
2020/01/20 Python
python sorted函数原理解析及练习
2020/02/10 Python
OpenCV Python实现拼图小游戏
2020/03/23 Python
如何基于Python代码实现高精度免费OCR工具
2020/06/18 Python
Pytorch学习之torch用法----比较操作(Comparison Ops)
2020/06/28 Python
用css3实现当鼠标移进去时当前亮其他变灰效果
2014/04/08 HTML / CSS
全球速卖通俄罗斯站:AliExpress俄罗斯
2019/06/17 全球购物
Servlet如何得到服务器的信息
2015/12/22 面试题
销售文员的岗位职责
2013/11/20 职场文书
服务员岗位职责
2014/01/29 职场文书
安全责任协议书
2014/04/21 职场文书
学习雷锋精神倡议书
2015/04/27 职场文书
2015年公路养护工作总结
2015/05/13 职场文书
2019数学教师下学期工作总结
2019/06/27 职场文书
创业计划书之服装
2019/10/07 职场文书
详解Oracle数据库中自带的所有表结构(sql代码)
2021/11/20 Oracle