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 相关文章推荐
网页javascript精华代码集
Jan 24 Javascript
javascript 构建一个xmlhttp对象池合理创建和使用xmlhttp对象
Jan 15 Javascript
jquery map方法使用示例
Apr 23 Javascript
js仿3366小游戏选字游戏
Apr 14 Javascript
angularjs实现下拉列表的选中事件示例
Mar 03 Javascript
单行 JS 实现移动端金钱格式的输入规则
May 22 Javascript
详解如何为你的angular app构建一个第三方库
Dec 07 Javascript
vue增加强缓存和版本号的实现方法
May 01 Javascript
微信小程序图片左右摆动效果详解
Jul 13 Javascript
详解BootStrap表单验证中重置BootStrap-select验证提示不清除的坑
Sep 17 Javascript
Vue vm.$attrs使用场景详解
Mar 08 Javascript
JavaScript架构搭建前端监控如何采集异常数据
Jun 25 Javascript
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
浅谈Eclipse PDT调试PHP程序
2014/06/09 PHP
成为好程序员必须避免的5个坏习惯
2014/07/04 PHP
PHP反射机制用法实例
2014/08/28 PHP
PHP设置头信息及取得返回头信息的方法
2016/01/25 PHP
Windows平台PHP+IECapt实现网页批量截图并创建缩略图功能详解
2019/08/02 PHP
laravel实现上传图片,并且制作缩略图,按照日期存放的代码
2019/10/16 PHP
CodeMirror2 IE7/IE8 下面未知运行时错误的解决方法
2012/03/29 Javascript
js unicode 编码解析关于数据转换为中文的两种方法
2014/04/21 Javascript
使用jQuery jqPlot插件绘制柱状图
2014/12/18 Javascript
解决微信小程序云开发中获取数据库的内容为空的方法
2019/05/15 Javascript
Vee-validate 父组件获取子组件表单校验结果的实例代码
2019/05/20 Javascript
Vue实现导航栏点击当前标签变色功能
2020/08/19 Javascript
layer.open弹层查看缩略图的原图,自适应大小的实例
2019/09/05 Javascript
vue中更改数组中属性,在页面中不生效的解决方法
2019/10/30 Javascript
jQuery弹框插件使用方法详解
2020/05/26 jQuery
JS页面动态绘图工具SVG,Canvas,VML介简介
2020/10/16 Javascript
antd中table展开行默认展示,且不需要前边的加号操作
2020/11/02 Javascript
python socket网络编程步骤详解(socket套接字使用)
2013/12/06 Python
Python读取图片EXIF信息类库介绍和使用实例
2014/07/10 Python
Python实现图像几何变换
2015/07/06 Python
Python爬虫实现网页信息抓取功能示例【URL与正则模块】
2017/05/18 Python
python统计字母、空格、数字等字符个数的实例
2018/06/29 Python
Python对象与引用的介绍
2019/01/24 Python
python re.sub()替换正则的匹配内容方法
2019/07/22 Python
Python 取numpy数组的某几行某几列方法
2019/10/24 Python
如何基于Python批量下载音乐
2019/11/11 Python
使用python实现数组、链表、队列、栈的方法
2019/12/20 Python
python pandas移动窗口函数rolling的用法
2020/02/29 Python
详解Anaconda 的安装教程
2020/09/23 Python
CSS3属性使网站设计增强同时不消弱可用性
2009/08/29 HTML / CSS
Urban Outfitters德国官网:美国跨国生活方式零售公司
2018/05/21 全球购物
什么是Linux虚拟文件系统VFS
2012/01/31 面试题
任课老师推荐信范文
2013/11/24 职场文书
四风之害观后感
2015/06/09 职场文书
python3 实现mysql数据库连接池的示例代码
2021/04/17 Python
Android Canvas绘制文字横纵向对齐
2022/06/05 Java/Android