解決遍歷時Array.indexOf產(chǎn)生的性能問題

更新時間：2012年07月03日 11:47:36 作者：

javascript中數(shù)組是沒有indexOf方法，extjs中給數(shù)據(jù)添加了該方法

 
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) ，所以，在數(shù)據(jù)量稍大的時候，需要尋找替代 Array 的辦法。有很多文章說過關(guān)于 Array 的這個問題，包括《權(quán)威指南》，辦法是模擬一個 Hash 表。
下面是有問題的代碼

復(fù)制代碼代碼如下:

 
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-瀏覽器會出現(xiàn)如下提示

按照《權(quán)威指南》中給出的提示，我對代碼做了如下修改后，問題解決。

復(fù)制代碼代碼如下:

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

您可能感興趣的文章:

相關(guān)文章

前端實現(xiàn)界面切換主題代碼示例
這篇文章主要介紹了前端實現(xiàn)界面切換主題的相關(guān)資料,文中介紹了兩種方法,通過link標簽的rel屬性和通過變量設(shè)置,前者適用于確定的主題樣式切換,后者則適用于在拾色器中任意選擇顏色更換主題的情況,需要的朋友可以參考下
2025-02-02
分享經(jīng)典的JavaScript開發(fā)技巧
這篇文章向大家分享了40多個經(jīng)典的JavaScript開發(fā)技巧，相信讀完這篇文章對大家開發(fā)javascript有很大的幫助作用，感興趣的小伙伴們可以參考一下
2015-11-11
JS實現(xiàn)壓縮上傳圖片base64長度功能
這篇文章主要介紹了js實現(xiàn)壓縮上傳圖片base64長度功能,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下
2019-12-12
js中confirm實現(xiàn)執(zhí)行操作前彈出確認框的方法
這篇文章主要介紹了js中confirm實現(xiàn)執(zhí)行操作前彈出確認框的方法,是執(zhí)行刪除等操作時常用的功能,非常具有實用價值,需要的朋友可以參考下
2014-11-11
JavaScript中Cookie操作實例
這篇文章主要介紹了JavaScript中Cookie操作實例,本文先是講解了Cookie的語法,然后給了實際操作實例,需要的朋友可以參考下
2015-01-01
js實現(xiàn)仿百度瀑布流的方法
這篇文章主要介紹了js實現(xiàn)仿百度瀑布流的方法,以完整實例形式分析了js仿百度瀑布流的相關(guān)樣式與實現(xiàn)技巧,具有一定參考借鑒價值,需要的朋友可以參考下
2015-02-02
JavaScript如何提取PDF中的圖片和文字
這篇文章主要為大家詳細介紹了JavaScript如何實現(xiàn)提取PDF中的圖片和文字,文中的示例代碼講解詳細,感興趣的小伙伴可以跟隨小編一起學習一下
2024-11-11
JavaScript中的值類型詳細介紹
這篇文章主要介紹了JavaScript中的值類型詳細介紹,本文講解了Primitive、Object、JS自帶全局對象、Immutable與Mutable等內(nèi)容,需要的朋友可以參考下
2014-12-12
js 實現(xiàn)無縫滾動兼容IE和FF
js 實現(xiàn)無縫滾動兼容IE FF，大家可以看看。
2009-07-07
JS中超越現(xiàn)實的匿名函數(shù)用法實例分析
這篇文章主要介紹了JS中超越現(xiàn)實的匿名函數(shù)用法,結(jié)合實例形式分析了javascript匿名函數(shù)定義、用法及相關(guān)操作注意事項,需要的朋友可以參考下
2019-06-06