从数据结构分析看:用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中的$(document).ready()与window.onload的区别
Nov 18 Javascript
载入jQuery库的最佳方法详细说明及实现代码
Dec 28 Javascript
Jquery ajaxStart()与ajaxStop()方法(实例讲解)
Dec 18 Javascript
javascript相关事件的几个概念
May 21 Javascript
简介JavaScript中strike()方法的使用
Jun 08 Javascript
javascript实现的猜数小游戏完整实例代码
May 10 Javascript
使用JavaScript实现弹出层效果的简单实例
May 31 Javascript
Bootstrap栅格系统的使用和理解2
Dec 14 Javascript
JS实现的获取银行卡号归属地及银行卡类型操作示例
Jan 08 Javascript
JavaScript如何使用插值实现图像渐变
Jun 28 Javascript
Vue element-ui父组件控制子组件的表单校验操作
Jul 17 Javascript
Vue3 实现双盒子定位Overlay的示例
Dec 22 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中利用str_pad函数生成数字递增形式的产品编号
2013/09/30 PHP
php面象对象数据库操作类实例
2014/12/02 PHP
分享10段PHP常用代码
2015/11/11 PHP
详解thinkphp5+swoole实现异步邮件群发(SMTP方式)
2017/10/13 PHP
PHP数组与字符串互相转换实例
2020/05/05 PHP
LazyForm jQuery plugin 定制您的CheckBox Radio和Select
2009/10/24 Javascript
再论Javascript下字符串连接的性能
2011/03/05 Javascript
Package.js  现代化的JavaScript项目make工具
2012/05/23 Javascript
js向上无缝滚动,网站公告效果 具体代码
2013/11/18 Javascript
用jquery.sortElements实现table排序
2014/05/04 Javascript
浅谈JavaScript超时调用和间歇调用
2015/08/30 Javascript
基于JS实现PHP的sprintf函数实例
2015/11/14 Javascript
JS原型链 详解及示例代码
2016/09/06 Javascript
HTML5+jQuery实现搜索智能匹配功能
2017/03/24 jQuery
React 使用browserHistory项目访问404问题解决
2018/06/01 Javascript
vue video和vue-video-player实现视频铺满教程
2020/10/30 Javascript
pygame学习笔记(5):游戏精灵
2015/04/15 Python
Python实现注册登录系统
2017/08/08 Python
Python编写一个优美的下载器
2018/04/15 Python
解决python selenium3启动不了firefox的问题
2018/10/13 Python
Python 数值区间处理_对interval 库的快速入门详解
2018/11/16 Python
使用pip安装python库的多种方式
2019/07/31 Python
Python图像处理模块ndimage用法实例分析
2019/09/05 Python
python 有效的括号的实现代码示例
2019/11/11 Python
Python实现Canny及Hough算法代码实例解析
2020/08/06 Python
关于探究python中sys.argv时遇到的问题详解
2021/02/23 Python
numpy实现RNN原理实现
2021/03/02 Python
巧用CSS3的calc()宽度计算做响应模式布局的方法
2018/03/22 HTML / CSS
html5中嵌入视频自动播放的问题解决
2020/05/25 HTML / CSS
德国珠宝和手表在线商店:VALMANO
2019/03/24 全球购物
在C中是否有模拟继承等面向对象程序设计特性的好方法
2012/05/22 面试题
优秀毕业生推荐信
2013/11/02 职场文书
小学教师办公室制度
2014/02/03 职场文书
自主招生教师推荐信
2014/05/10 职场文书
投标人法定代表人授权委托书格式
2014/09/28 职场文书
公司开业的祝贺语大全(60条)
2019/07/05 职场文书