? ? 當我們要對數(shù)組或者是集合進行讀取數(shù)據(jù)的時候,就會用到遍歷,那么,各種遍歷都有什么特點呢,今天小編就帶領(lǐng)大家一探j(luò)avaScript中的遍歷.
首先介紹數(shù)組的定義方法
//第一種:構(gòu)造函數(shù)法 ,通過 new? 關(guān)鍵字 定義數(shù)組
var array = new Array();
//第二種:直接定義法,這里 [] 里面的值,可有 可無,這種定義方式下的數(shù)組 長度是可擴展的
//注意:若[]中有元素時,需要用"," 分隔,否則 就是 一個元素了
var array2 = [];
//聲明一系列數(shù)據(jù)結(jié)構(gòu)
//構(gòu)造函數(shù)
function Person ( name ){
this.name = name;
}
//數(shù)組:數(shù)組元素是構(gòu)造函數(shù)生成的對象
var arr = [ new Person("小王") , new Person ("小紅") , new
Person("小李") ];
//字面量對象
//注意:字面量對象中有多個元素的時候 用"," 逗號隔開
var game = {
"name" : "lili",
"type" : "USA"
}
1.普通的 for? 循環(huán)遍歷
第一種:最常用的 for 循環(huán)遍歷 ,適合 所有的情況
//這種遍歷需要通過下標的方式讀取對象
for ( var i =0 ; i < arr.length ;? i++ ) {
console.log( arr[i]);
}
2.for ..in 循環(huán)遍歷
//遍歷數(shù)組注意: 以后 能不用 for..in 遍歷數(shù)組,就不用, for..in
性能不好,而且容易造成下標錯亂問題
//tempIdx? 表示數(shù)組的下標
//arr 表示要遍歷的數(shù)組
for( var tempIdx in arr ){
console.log( arr[tempIdx].name);
}
//遍歷對象:for..in非常適合去遍歷字面量對象
//左邊變量:是這個對象的每一個屬性
//右邊變量:要遍歷的對象
for ( var tempProp in game ){
//這里要注意:當屬性為變量的時候,要用方括號[]去訪問!!!
//game.tempProp 訪問game下的 tempProp屬性
undefined
console.log( game[tempProp] );
}
3. forEach( ) 遍歷
//遍歷數(shù)組
//如果遍歷數(shù)組,這個方法其實是Array.prototype.forEach( )
//數(shù)組的原型方法
//forEach 的參數(shù)? 是一種匿名函數(shù)
//這個匿名函數(shù)的參數(shù)
//第一個參數(shù): 數(shù)組的每個元素
//第二個參數(shù): 數(shù)組的下標
//第三個參數(shù): 當前數(shù)組對象
//注意:forEach 遍歷有一個致命的? 缺陷, 不能使用
break? continue
return
arr.forEach ( function( ele , idx , array ){
console.log ( ele.name ) ;//每個元素
console.log ( idx );//下標
console.log ( array );//當前數(shù)組
});
//遍歷Map
//如果遍歷 Map,這個方法其實是 Map.prototype.forEach
//forEach 的參數(shù): 是一個匿名回調(diào) 函數(shù)
//這個匿名 函數(shù)的參數(shù)
//第一個參數(shù): value值
//第二個參數(shù): key值
//第三個參數(shù): 當前的對象
map.forEach( function( value , key , map ){
console.log( key ":" value );
}
4. for..of 遍歷
//遍歷數(shù)組
//第一個變量: 數(shù)組中的每一個元素
//第二個遍歷: 要遍歷的數(shù)組對象
for( var temple of arr ) {
console.log( tempEle.name );
}
//遍歷map
//第一個參數(shù): 是一個數(shù)組,數(shù)組中有兩個元素 ,分別是key 和 value
//第二個參數(shù): 要遍歷的map對象
for( var [ key , value ] of map ){
console.log( key "--" value );
}
//另一種方式
for( var keyAndValue of map ){
console.log( keyAndValue[0] "--" keyAndValue[1] );
}
注意:for..of 不能遍歷 object 集合,假如要遍歷 object集合,需要先用普通的for循環(huán)
遍歷object集合,添加到數(shù)組,再對其進行下一步操作