解决遍历时Array.indexOf产生的性能问题


Posted in Javascript onJuly 03, 2012
Ext.applyIf(Array.prototype, { 
/** 
* Checks whether or not the specified object exists in the array. 
* @param {Object} o The object to check for 
* @param {Number} from (Optional) The index at which to begin the search 
* @return {Number} The index of o in the array (or -1 if it is not found) 
*/ 
indexOf : function(o, from){ 
var len = this.length; 
from = from || 0; 
from += (from < 0) ? len : 0; 
for (; from < len; ++from){ 
if(this[from] === o){ 
return from; 
} 
}); 
return -1; 
}

从源码可以看出,查找是简单的线性查找。
由于线性查找效率是 O(n) ,所以,在数据量稍大的时候,需要寻找替代 Array 的办法。有很多文章说过关于 Array 的这个问题,包括《权威指南》,办法是模拟一个 Hash 表。
下面是有问题的代码
var hostsIP = []; 
Ext.each(_this.hosts,function(item){ 
hostsIP.push(item.ip); 
}); 
Ext.each(txtHostsIP,function(ip){ 
if(hostsIP.indexOf(ip)===-1){//问题代码 
var host = { 
isAppend : true,//新增的主机 
isAgentOk : false, 
ip : ip 
}; 
_this.hosts.push( 
Ext.apply(host,_this.MAPPING_FIELDS) 
); 
isAppend = true; 
}else{ 
errors.push('IP['+ip+']已存在'); 
} 
});

当hostsIP长度超过2000个时,IE8-浏览器会出现如下提示

解决遍历时Array.indexOf产生的性能问题

按照《权威指南》中给出的提示,我对代码做了如下修改后,问题解决。
var hostsIP = {}; 
Ext.each(_this.hosts,function(item){ 
hostsIP[item.ip]=item.ip; 
}); Ext.each(txtHostsIP,function(ip){ 
if(!hostsIP.hasOwnProperty(ip)){ 
var host = { 
isAppend : true,//新增的主机 
isAgentOk : false, 
ip : ip 
}; 
_this.hosts.push( 
Ext.apply(host,_this.MAPPING_FIELDS) 
); 
isAppend = true; 
}else{ 
errors.push('IP['+ip+']已存在'); 
} 
});
Javascript 相关文章推荐
给moz-firefox下添加IE方法和属性
Apr 10 Javascript
简单的JS多重继承示例
Mar 13 Javascript
JQuery动画和停止动画实例代码
Mar 01 Javascript
使用javascript创建快捷方式的简单实例
Aug 09 Javascript
基于jquery实现复选框全选,反选,全不选等功能
Oct 16 Javascript
详解js实现线段交点的三种算法
Aug 09 Javascript
js实现手机发送验证码功能
Mar 13 Javascript
JS手机端touch事件计算滑动距离的方法示例
Oct 26 Javascript
微信小程序实现刷脸登录
May 25 Javascript
JavaScript实现的九种排序算法
Mar 04 Javascript
JavaScript实现PC端横向轮播图
Feb 07 Javascript
vue项目启动出现cannot GET /服务错误的解决方法
Apr 26 Javascript
JavaScript中变量提升 Hoisting
Jul 03 #Javascript
JavaScript Scoping and Hoisting 翻译
Jul 03 #Javascript
jquery 中多条件选择器,相对选择器,层次选择器的区别
Jul 03 #Javascript
jquery 实现表单验证功能代码(简洁)
Jul 03 #Javascript
JavaScript中的细节分析
Jun 30 #Javascript
JavaScript中的作用域链和闭包
Jun 30 #Javascript
JavaScript中的面向对象介绍
Jun 30 #Javascript
You might like
用PHP ob_start()控制浏览器cache、生成html实现代码
2010/02/16 PHP
php数组函数序列之array_keys() - 获取数组键名
2011/10/30 PHP
php字符串分割函数explode的实例代码
2013/02/07 PHP
php中error与exception的区别及应用
2014/07/28 PHP
WordPress中调试缩略图的相关PHP函数使用解析
2016/01/07 PHP
thinkphp ajaxfileupload实现异步上传图片的示例
2017/08/28 PHP
JavaScript设计模式之单件模式介绍
2014/12/28 Javascript
使用命令对象代替switch语句的写法示例
2015/02/28 Javascript
轻松学习jQuery插件EasyUI EasyUI实现树形网络基本操作(2)
2015/11/30 Javascript
js获取iframe中的window对象的实现方法
2016/05/20 Javascript
Bootstrap弹出框(modal)垂直居中的问题及解决方案详解
2016/06/12 Javascript
用jQuery实现圆点图片轮播效果
2017/03/19 Javascript
vue cli使用绝对路径引用图片问题的解决
2017/12/06 Javascript
使用 Node.js 开发资讯爬虫流程
2018/01/07 Javascript
vue 路由页面之间实现用手指进行滑动的方法
2018/02/23 Javascript
es6数据变更同步到视图层的方法
2019/03/04 Javascript
webpack项目使用eslint建立代码规范实现
2019/05/16 Javascript
node.js处理前端提交的GET请求
2019/08/30 Javascript
Python自动生成代码 使用tkinter图形化操作并生成代码框架
2019/09/18 Python
PyQt5中向单元格添加控件的方法示例
2020/03/24 Python
如何在Windows中安装多个python解释器
2020/06/16 Python
HTML5 embed 标签使用方法介绍
2013/08/13 HTML / CSS
英国最大的邮寄种子和植物公司:Thompson & Morgan
2017/09/21 全球购物
英国一家集合了众多有才华设计师品牌的奢侈店:Wolf & Badger
2018/04/18 全球购物
Java 中访问数据库的步骤?Statement 和PreparedStatement 之间的区别?
2012/06/05 面试题
硕士研究生自我鉴定
2013/11/08 职场文书
《悯农》教学反思
2014/04/28 职场文书
社区维稳工作方案
2014/06/06 职场文书
机械专业应届毕业生自荐书
2014/06/12 职场文书
农村门前三包责任书
2014/07/25 职场文书
社区党的群众路线教育实践活动领导班子对照检查材料
2014/09/25 职场文书
行政诉讼答辩状
2015/05/21 职场文书
食品卫生管理制度
2015/08/06 职场文书
2016创先争优活动党员公开承诺书
2016/03/24 职场文书
护理自荐信
2019/05/14 职场文书
Mysql中一千万条数据怎么快速查询
2021/12/06 MySQL