解决遍历时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 相关文章推荐
B/S开发中常用javaScript技术与代码
Mar 09 Javascript
javascript学习网址备忘
May 29 Javascript
javascript[js]获取url参数的代码
Oct 17 Javascript
ExtJS 2.0实用简明教程 之Border区域布局
Apr 29 Javascript
getElementByIdx_x js自定义getElementById函数
Jan 24 Javascript
实现placeholder效果的方案汇总
Jun 11 Javascript
表单input项使用label同时引用Bootstrap库导致input点击效果区增大问题
Oct 11 Javascript
flexslider.js实现移动端轮播
Feb 05 Javascript
vue实现动态数据绑定
Apr 28 Javascript
详解Angular 4.x NgTemplateOutlet
May 24 Javascript
Vue波纹按钮组件制作
Apr 30 Javascript
使用 UniApp 实现小程序的微信登录功能
Jun 09 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采用curl访问域名返回405 method not allowed提示的解决方法
2014/06/26 PHP
用PHP解决的一个栈的面试题
2014/07/02 PHP
PJ Blog修改-禁止复制的代码和方法
2006/10/25 Javascript
读jQuery之二(两种扩展)
2011/06/11 Javascript
使用jQuery UI的tooltip函数修饰title属性的气泡悬浮框
2013/06/24 Javascript
js子页面获取父页面数据示例
2014/05/15 Javascript
jQuery实现Table表格隔行变色及高亮显示当前选择行效果示例
2017/02/14 Javascript
微信小程序 支付后台java实现实例
2017/05/09 Javascript
js实现登录注册框手机号和验证码校验(前端部分)
2017/09/28 Javascript
解决在Bootstrap模糊框中使用WebUploader的问题
2018/03/22 Javascript
vue中使用heatmapjs的示例代码(结合百度地图)
2018/09/05 Javascript
vue-cli3+ts+webpack实现多入口多出口功能
2019/05/30 Javascript
layui实现根据table数据判断按钮显示情况的方法
2019/09/26 Javascript
vue实现商城秒杀倒计时功能
2019/12/12 Javascript
Vue 嵌套路由使用总结(推荐)
2020/01/13 Javascript
[11:57]《一刀刀一天》第十七期:TI中国军团加油!
2014/05/26 DOTA
[02:17]《辉夜杯》TRG战队巡礼
2015/10/26 DOTA
[46:12]完美世界DOTA2联赛循环赛 DM vs Matador BO2第一场 11.04
2020/11/04 DOTA
详解Django中的form库的使用
2015/07/18 Python
Python交互环境下实现输入代码
2018/06/22 Python
小白入门篇使用Python搭建点击率预估模型
2018/10/12 Python
浅谈python3发送post请求参数为空的情况
2018/12/28 Python
详解Django+uwsgi+Nginx上线最佳实战
2019/03/14 Python
Django项目之Elasticsearch搜索引擎的实例
2019/08/21 Python
如何创建一个Flask项目并进行简单配置
2020/11/18 Python
匡威帆布鞋美国官网:Converse美国
2016/08/22 全球购物
英国领先的电子、技术和办公用品购物网站:Ebuyer
2018/04/04 全球购物
俄罗斯达美乐比萨外送服务:Domino’s Pizza
2020/12/18 全球购物
机械系大学毕业生推荐信
2013/11/27 职场文书
函授本科自我鉴定
2014/02/04 职场文书
双创工作实施方案
2014/03/26 职场文书
铁路安全事故反思
2014/04/26 职场文书
陶瓷类经典广告语集锦
2019/10/25 职场文书
python析构函数用法及注意事项
2021/06/22 Python
Golang原生rpc(rpc服务端源码解读)
2022/04/07 Golang
Python中的 enumerate和zip详情
2022/05/30 Python