JavaScript中的集合及效率


Posted in Javascript onJanuary 08, 2010

虽然这个集合的 key 只能是 String 类型,不像 Java 里面的各种集合类能够使用各种对象作为 Key ,但对于实现一般的客户端 JS 功能来说,已经是足够用了。同样,因为所有的 JS 内部对象都继承自 Object 对象,所以实际上 JS 的 Array 对象也可以使用字符串来做为数组的下标,就像 PHP 中的数组变量一样。来自鸟食轩。

数组是JavaScript提供的一个内部对象,它是一个标准的集合,我们可以添加(push)、删除(shift)里面元素,我们还可以通过for循环遍历里面的元素,那么除了数组我们在JavaScript里还可以有别的集合吗?

由于JavaScript的语言特性,我们可以向通用对象动态添加和删除属性。所以Object也可以看成是JS的一种特殊的集合。下面比较一下Array和Object的特性:

Array:

新建:var ary = new Array(); 或 var ary = [];
增加:ary.push(value);
删除:delete ary[n];
遍历:for ( var i=0 ; i < ary.length ; ++i ) ary[i];

Object:

新建:var obj = new Object(); 或 var obj = {};
增加:obj[key] = value; (key为string)
删除:delete obj[key];
遍历:for ( var key in obj ) obj[key];

从上面的比较可以看出Object完全可以作为一个集合来使用,在使用Popup窗口创建无限级Web页菜单(3)中我介绍过Eric实现的那个__MenuCache__,它也就是一个模拟的集合对象。

如果我们要在Array中检索出一个指定的值,我们需要遍历整个数组:

var keyword = ; 
for ( var i=0 ; i < ary.length ; ++i ) 
{ 
if ( ary[i] == keyword ) 
{ 
// todo 
} 
}

而我们在Object中检索一个指定的key的条目,只需要是要使用:

var key = '';
var value = obj[key];
// todo

Object的这个特性可以用来高效的检索Unique的字符串集合,遍历Array的时间复杂度是O(n),而遍历Object的时间复杂度是 O(1)。虽然对于10000次集合的for检索代价也就几十ms,可是如果是1000*1000次检索或更多,使用Object的优势一下就体现出来了。在此之前我做了一个mapping,把100个Unique的字符mapping到1000个字符串数组上,耗时25-30s!后来把for遍历改成了Object模拟的集合的成员引用,同样的数据量mapping,耗时仅1.7-2s!!!

对于集合的遍历效率(从高到低):var value = obj[key]; > for ( ; ; ) > for ( in )。效率最差的就是for( in )了,如果集合过大,尽量不要使用for ( in )遍历。

Javascript 相关文章推荐
使用prototype.js 的时候应该特别注意的几个问题.
Apr 12 Javascript
IE图片缓存document.execCommand(&quot;BackgroundImageCache&quot;,false,true)
Mar 01 Javascript
jquery实现弹出窗口效果的实例代码
Nov 28 Javascript
js控制鼠标事件移动及移出效果显示
Oct 19 Javascript
前端学习笔记style,currentStyle,getComputedStyle的用法与区别
May 28 Javascript
简单谈谈ES6的六个小特性
Nov 18 Javascript
原生JavaScript实现AJAX、JSONP
Feb 07 Javascript
微信小程序 action-sheet 反馈上拉菜单简单实例
May 11 Javascript
vue.js内部自定义指令与全局自定义指令的实现详解(利用directive)
Jul 11 Javascript
layui点击导航栏刷新tab页的示例代码
Aug 14 Javascript
mpvue微信小程序开发之实现一个弹幕评论
Nov 24 Javascript
jQuery插件实现图片轮播效果
Oct 19 jQuery
Extjs TriggerField在弹出窗口显示不出问题的解决方法
Jan 08 #Javascript
Extjs学习笔记之八 继承和事件基础
Jan 08 #Javascript
Extjs学习笔记之七 布局
Jan 08 #Javascript
IE6下JS动态设置图片src地址问题
Jan 08 #Javascript
Javascript 中的类和闭包
Jan 08 #Javascript
Extjs学习笔记之六 面版
Jan 08 #Javascript
jQuery开发者都需要知道的5个小技巧
Jan 08 #Javascript
You might like
PHP的autoload机制的实现解析
2012/09/15 PHP
一段多浏览器的&quot;复制到剪贴板&quot;javascript代码
2007/03/27 Javascript
js 获取浏览器高度和宽度值(多浏览器)
2009/09/02 Javascript
两种WEB下的模态对话框 (asp.net或js的分别实现)
2009/12/02 Javascript
基于jquery的让textarea自适应高度的插件
2010/08/03 Javascript
jQuery弹出层始终垂直居中相对于屏幕或当前窗口
2013/04/01 Javascript
js导出格式化的excel 实例方法
2013/07/17 Javascript
一个判断抢购时间是否到达的简单的js函数
2014/06/23 Javascript
JS中的数组方法笔记整理
2016/07/26 Javascript
Bootstrap CSS布局之表格
2016/12/17 Javascript
nodejs中全局变量的实例解析
2017/03/07 NodeJs
vue 自定义全局方法,在组件里面的使用介绍
2018/02/28 Javascript
解决vue+element 键盘回车事件导致页面刷新的问题
2018/08/25 Javascript
Vue匿名插槽与作用域插槽的合并和覆盖行为
2019/04/22 Javascript
浅谈layui框架自带分页和表格重载的接口解析问题
2019/09/11 Javascript
layui点击左侧导航栏,实现不刷新整个页面,只刷新局部的方法
2019/09/25 Javascript
基于vue实现探探滑动组件功能
2020/05/29 Javascript
[01:08]DOTA2“血战之命”预告片
2017/08/12 DOTA
使用Python的PEAK来适配协议的教程
2015/04/14 Python
简述Python中的面向对象编程的概念
2015/04/27 Python
利用Python暴力破解zip文件口令的方法详解
2017/12/21 Python
python 编码规范整理
2018/05/05 Python
解决python3 网络请求路径包含中文的问题
2018/05/10 Python
python开头的coding设置方法
2019/08/08 Python
德国大型的家具商店:Pharao24.de
2016/10/02 全球购物
Speedo澳大利亚官网:全球领先游泳品牌
2018/02/04 全球购物
美国折扣宠物药房:Total Pet Supply
2018/05/27 全球购物
Bally巴利中国官网:经典瑞士鞋履、手袋及配饰奢侈品牌
2018/10/09 全球购物
英文版餐饮业求职信
2013/10/18 职场文书
回门宴答谢词
2014/01/13 职场文书
机关党建工作汇报材料
2014/08/20 职场文书
群众路线教育查摆剖析材料
2014/10/10 职场文书
体育教师个人总结
2015/02/09 职场文书
工人先锋号事迹材料(2016精选版)
2016/03/01 职场文书
MongoDB数据库的安装步骤
2021/06/18 MongoDB
MySql 8.0及对应驱动包匹配的注意点说明
2021/06/23 MySQL