1. 程式人生 > >js中遍歷陣列、物件的方式

js中遍歷陣列、物件的方式

1、標準的for迴圈
   var array = [1,2,3,4,5,6,7];  
    for (var i = 0; i < array.length; i) {  
        console.log(i,array[i]);  
    }  

//foreach迴圈
for(var i in array){
alert(array[i])
}
正常情況下上面兩種遍歷陣列的方式結果一樣。首先說兩者的第一個區別

標準的for迴圈中的i是number型別,表示的是陣列的下標,但是foreach迴圈中的i表示的是陣列的key是string型別,因為js中一切皆為物件。自己試試 alert(typeof i);這個區別是小問題。現在我加上如下程式碼,上面的執行結果就不一樣了。

//擴充套件了js原生的Array
Array.prototype.test=function()

}
試試看上面的程式碼執行什麼。我們發現標準的for迴圈任然真正的對陣列迴圈, 但是此時foreach迴圈對我剛才寫的test方法寫打印出來了。這就是for與foreach遍歷陣列的最大區別,如果我們在專案採用的是用foreach遍歷陣列,假設有一天誰不小心自己為了擴充套件js原生的Array類,或者引入一個外部的js框架也擴充套件了原生Array。那問題就來了。再此建議兩點

不要用for in遍歷陣列,全部統一採用標準的for迴圈變數陣列(我們無法保證我們引入的js是否會採用prototype擴充套件原生的Array)
如果要對js的原生類擴充套件的時候,不要採用prototype了

var keys = Object.keys(element);
$.each(keys,function(i,ele){
if(!element[ele]){
element[ele] = '--'
}
});
for(var key in element){
console.log(key);
console.log(element[key]);
}