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 兼容FF的onmouseenter和onmouseleave的代码
Jul 19 Javascript
基于JavaScript实现继承机制之原型链(prototype chaining)的详解
May 07 Javascript
from 表单提交返回值用post或者是get方法实现
Aug 21 Javascript
jquery限定文本框只能输入数字即整数和小数
Nov 29 Javascript
Javascript中Array.prototype.map()详解
Oct 22 Javascript
理解javascript封装
Feb 23 Javascript
Node.js环境下JavaScript实现单链表与双链表结构
Jun 12 Javascript
全屏滚动插件fullPage.js使用实例解析
Oct 21 Javascript
Canvas实现动态的雪花效果
Feb 13 Javascript
微信小程序页面传值实例分析
Apr 19 Javascript
jQuery实现tab栏切换效果
Dec 22 jQuery
JS的深浅复制详细
Oct 16 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
如何用PHP实现插入排序?
2013/04/10 PHP
PHP Callable强制指定回调类型的方法
2016/08/30 PHP
PHP正则+Snoopy抓取框架实现的抓取淘宝店信誉功能实例
2017/05/17 PHP
PHP创建自己的Composer包方法
2018/04/09 PHP
10个新的最有前途的JavaScript框架
2009/03/12 Javascript
兼容IE和FF的图片上传前预览js代码
2013/05/28 Javascript
浅析showModalDialog数据缓存问题(用禁止浏览器缓存解决)
2013/07/09 Javascript
jqGrid随窗口大小变化自适应大小的示例代码
2013/12/28 Javascript
jQuery队列操作方法实例
2014/06/11 Javascript
日常收集整理的JavaScript常用函数方法
2015/12/10 Javascript
jQuery使用模式窗口实现在主页面和子页面中互相传值的方法
2016/03/01 Javascript
微信jssdk在iframe页面失效问题的解决措施
2016/03/03 Javascript
JS组件Bootstrap按钮组与下拉按钮详解
2016/05/10 Javascript
form表单转Json提交的方法(推荐)
2016/09/23 Javascript
微信小程序开发animation心跳动画效果
2017/08/16 Javascript
对vue.js中this.$emit的深入理解
2018/02/23 Javascript
JavaScript 五大常见函数
2018/03/23 Javascript
详解Koa中更方便简单发送响应的方式
2018/07/20 Javascript
vue中v-for通过动态绑定class实现触发效果
2018/12/06 Javascript
微信小程序实现人脸识别登陆的示例代码
2019/04/02 Javascript
微信小程序开发摇一摇功能
2019/11/22 Javascript
vue总线机制(bus)知识点详解
2020/05/10 Javascript
在Echarts图中给坐标轴加一个标识线markLine
2020/07/20 Javascript
JavaScript Image对象实现原理实例解析
2020/08/26 Javascript
Python的Tornado框架实现异步非阻塞访问数据库的示例
2016/06/30 Python
Python3实现并发检验代理池地址的方法
2016/09/18 Python
使用python语言,比较两个字符串是否相同的实例
2018/06/29 Python
Python基于opencv调用摄像头获取个人图片的实现方法
2019/02/21 Python
Django框架组成结构、基本概念与文件功能分析
2019/07/30 Python
python爬虫中多线程的使用详解
2019/09/23 Python
python opencv如何实现图片绘制
2020/01/19 Python
html5手机端页面可以向右滑动导致样式受影响的问题
2018/06/20 HTML / CSS
美体小铺奥地利官方网站:The Body Shop奥地利
2019/04/11 全球购物
自动化工程专业个人应聘自荐信
2013/09/26 职场文书
办公室文员工作自我鉴定
2014/09/19 职场文书
小学2016年第十八届推普周活动总结
2016/04/05 职场文书