从数据结构分析看:用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 相关文章推荐
巧用jquery解决下拉菜单被Div遮挡的相关问题
Feb 13 Javascript
jquerymobile局部渲染的各种刷新方法小结
Mar 05 Javascript
JS打字效果的动态菜单代码分享
Aug 21 Javascript
js图片轮播手动切换效果
Nov 10 Javascript
jquery实现移动端点击图片查看大图特效
Sep 11 Javascript
Json按某个键的值进行排序
Dec 22 Javascript
JavaScript数据类型和变量_动力节点Java学院整理
Jun 26 Javascript
layer.confirm取消按钮绑定事件的方法
Aug 17 Javascript
vue-quill-editor富文本编辑器简单使用方法
Sep 21 Javascript
node 文件上传接口的转发的实现
Sep 23 Javascript
Vue+element+cookie记住密码功能的简单实现方法
Sep 20 Javascript
javascript实现简易计算器功能
Sep 23 Javascript
关于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
实用函数3
2007/11/08 PHP
php session 检测和注销
2009/03/16 PHP
php microtime获取浮点的时间戳
2010/02/21 PHP
php查询ip所在地的方法
2014/12/05 PHP
php判断数组是否为空的实例方法
2020/05/10 PHP
Thinkphp 框架配置操作之配置加载与读取配置实例分析
2020/05/15 PHP
js类中获取外部函数名的方法与代码
2007/09/12 Javascript
ajax 文件上传应用简单实现
2009/03/03 Javascript
JavaScript中OnLoad几种使用方法
2012/12/15 Javascript
文字垂直滚动之javascript代码
2015/07/29 Javascript
jQuery mobile 移动web(6)
2015/12/20 Javascript
Bootstrap中datetimepicker使用小结
2016/12/28 Javascript
jQuery实现表格元素动态创建功能
2017/01/09 Javascript
nodejs个人博客开发第三步 载入页面
2017/04/12 NodeJs
老生常谈js数据类型
2017/08/03 Javascript
详解使用angular的HttpClient搭配rxjs
2017/09/01 Javascript
JS实现获取汉字首字母拼音、全拼音及混拼音的方法
2017/11/14 Javascript
Javascript中从学习bind到实现bind的过程
2018/01/05 Javascript
Vue微信项目按需授权登录策略实践思路详解
2018/05/07 Javascript
Vue将页面导出为图片或者PDF
2020/08/17 Javascript
浅谈一种让小程序支持JSX语法的新思路
2019/06/16 Javascript
[02:06]2018完美世界全国高校联赛秋季赛开始报名(附彩蛋)
2018/09/03 DOTA
Python实现判断字符串中包含某个字符的判断函数示例
2018/01/08 Python
Python将json文件写入ES数据库的方法
2019/04/10 Python
Python通过cv2读取多个USB摄像头
2019/08/28 Python
Python全栈之列表数据类型详解
2019/10/01 Python
Python正则表达式高级使用方法汇总
2020/06/18 Python
Python 没有main函数的原因
2020/07/10 Python
h5网页水印SDK的实现代码示例
2019/02/19 HTML / CSS
快时尚眼镜品牌,全国连锁眼镜店:LOHO眼镜生活
2018/10/08 全球购物
美国宠物护理专家:Revival Animal Health
2020/01/05 全球购物
文秘专业应届生求职信范文
2013/11/14 职场文书
文化产业实施方案
2014/06/07 职场文书
鸟的天堂导游词
2015/01/31 职场文书
办公室文员岗位职责
2015/02/04 职场文书
JVM的类加载器和双亲委派模式你了解吗
2022/03/13 Java/Android