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

更新时间：2012年07月03日 11:47:36 作者：

javascript中数组是没有indexOf方法，extjs中给数据添加了该方法

 
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-浏览器会出现如下提示

按照《权威指南》中给出的提示，我对代码做了如下修改后，问题解决。

复制代码代码如下:

 
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+']已存在'); 
} 
}); 

您可能感兴趣的文章:

js脚本实现数据去重
最近在一个项目中，需要去除掉重复的数据，之前都是在后台实现，现在客户需求是在前台去重，于是就想到了javascript脚本。
2014-11-11
Javascript实现关联数据(Linked Data)查询及注意细节
DBpedia对Wikipedia的数据变成Linked Data形式，使得机器也能读懂并自由获得这些数据;本文的主要目的是利用Javascript从DBpedia中获取我们想要的数据,感兴趣的朋友可以参考下，希望可以帮助到你
2013-02-02
纯Javascript实现ping功能的方法
这篇文章主要介绍了纯Javascript实现ping功能的方法,实例分析了javascript实现ping功能的技巧,具有一定参考借鉴价值,需要的朋友可以参考下
2015-03-03
javascript+html5+css3自定义弹出窗口效果
这篇文章主要为大家详细介绍了javascript+html5+css3自定义弹出窗口效果，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2017-10-10
记一次webapck4 配置文件无效的解决历程
这篇文章主要介绍了记一次webapck4 配置文件无效的解决历程，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2018-09-09
JavaScript canvas 实现用代码画画
这篇文章主要为大家介绍了JavaScript canvas 实现用代码画画示例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
2022-11-11
JavaScript实现带播放列表的音乐播放器实例分享
这篇文章主要介绍了JavaScript实现带播放列表的音乐播放器实例分享,包括对播放完歌单之后没有将要播放的歌曲的提示功能,需要的朋友可以参考下
2016-03-03
ES6新特性六：promise对象实例详解
这篇文章主要介绍了ES6新特性之promise对象,结合实例形式详细分析了promise对象的功能、状态、使用方法与相关操作技巧,需要的朋友可以参考下
2017-04-04
JS实现购物车中商品总价计算
这篇文章主要为大家详细介绍了JS实现购物车中商品总价的计算，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2021-03-03
收集前端面试题之url、href、src
本文给大家分享小编日常收集整理的关于前端面试题之url、href、src的语法规则及基本概念，非常不错，具有参考借鉴价值，需要的朋友参考下吧
2018-03-03