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编程起步(第二课)
Feb 27 Javascript
JS backgroundImage控制
May 19 Javascript
js+CSS实现弹出居中背景半透明div层的方法
Feb 26 Javascript
jQuery实现类似淘宝网图片放大效果的方法
Jul 08 Javascript
jQuery实现自动切换播放的经典滑动门效果
Sep 12 Javascript
JavaScript正则表达式匹配 div  style标签
Mar 15 Javascript
详解Vue监听数据变化原理
Mar 08 Javascript
js实现简单的二级联动效果
Mar 09 Javascript
vue-quill-editor实现图片上传功能
Aug 08 Javascript
javascript基本常用排序算法解析
Sep 27 Javascript
vue2.0 element-ui中el-select选择器无法显示选中的内容(解决方法)
Aug 24 Javascript
vue项目中实现缓存的最佳方案详解
Jul 11 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数组应用之比较两个时间的相减排序
2008/08/18 PHP
PHP详解ASCII码对照表与字符转换
2011/12/05 PHP
Zend Framework教程之MVC框架的Controller用法分析
2016/03/07 PHP
PHP 99乘法表的几种实现代码
2020/10/13 PHP
js类中获取外部函数名的方法
2007/08/19 Javascript
jQuery中jqGrid分页实现代码
2011/11/04 Javascript
从阶乘函数对比Javascript和C#的异同
2012/05/31 Javascript
JS中页面与页面之间超链接跳转中文乱码问题的解决办法
2016/12/15 Javascript
jquery中$.fn和图片滚动效果实现的必备知识总结
2017/04/21 jQuery
angular2中router路由跳转navigate的使用与刷新页面问题详解
2017/05/07 Javascript
vue2项目使用sass的示例代码
2017/06/28 Javascript
Windows下快速搭建NodeJS本地服务器的步骤
2017/08/09 NodeJs
vue综合组件间的通信详解
2017/11/06 Javascript
JS中利用FileReader实现上传图片前本地预览功能
2018/03/02 Javascript
angular5 子组件监听父组件传入值的变化方法
2018/09/30 Javascript
Web安全之XSS攻击与防御小结
2018/12/13 Javascript
vue项目创建并引入饿了么elementUI组件的步骤
2019/04/11 Javascript
vue中使用百度脑图kityminder-core二次开发的实现
2019/09/26 Javascript
JavaScript如何把两个数组对象合并过程解析
2019/10/10 Javascript
Json实现传值到后台代码实例
2020/06/30 Javascript
微信小程序实现可拖动悬浮图标(包括按钮角标的实现)
2020/12/29 Javascript
python清除指定目录内所有文件中script的方法
2015/06/30 Python
使用Python写个小监控
2016/01/27 Python
python学习教程之使用py2exe打包
2017/09/24 Python
Python3.5面向对象编程图文与实例详解
2019/04/24 Python
django使用django-apscheduler 实现定时任务的例子
2019/07/20 Python
python 实现turtle画图并导出图片格式的文件
2019/12/07 Python
基于HTML5 Canvas 实现弹出框效果
2017/06/05 HTML / CSS
全球领先的在线cosplay服装商店:RoleCosplay
2020/01/18 全球购物
PHP面试题及答案二
2015/05/23 面试题
追悼会子女答谢词
2014/01/28 职场文书
美国留学经济担保书
2014/05/20 职场文书
考试作弊检讨书
2014/10/21 职场文书
2014年大学学生会工作总结
2014/12/02 职场文书
2016年教师师德师风心得体会
2016/01/12 职场文书
springboot+WebMagic+MyBatis爬虫框架的使用
2021/08/07 Java/Android