針對(duì)js各種遍歷作一個(gè)總結(jié)分析,從類型用處:分?jǐn)?shù)組遍歷和對(duì)象遍歷;還有性能,優(yōu)缺點(diǎn)等。 JS數(shù)組遍歷:1,普通for循環(huán),經(jīng)常用的數(shù)組遍歷 var arr = [1,2,0,3,9];
for ( var i = 0; i <arr.length; i++){
console.log(arr[i]);
}
2,優(yōu)化版for循環(huán):使用變量,將長(zhǎng)度緩存起來(lái),避免重復(fù)獲取長(zhǎng)度,數(shù)組很大時(shí)優(yōu)化效果明顯 for(var j = 0,len = arr.length; j < len; j++){
console.log(arr[j]);
}
3,forEach,ES5推出的,數(shù)組自帶的循環(huán),主要功能是遍歷數(shù)組,實(shí)際性能比f(wàn)or還弱 arr.forEach(function(value,i){ }) forEach這種方法也有一個(gè)小缺陷:你不能使用break語(yǔ)句中斷循環(huán),也不能使用return語(yǔ)句返回到外層函數(shù)。 4,map遍歷,map即是 “映射”的意思 用法與 forEach 相似 arr.map(function(value,index){
console.log('map遍歷:'+index+'--'+value);
});
map遍歷支持使用return語(yǔ)句,支持return返回值 var temp=arr.map(function(val,index){
console.log(val);
return val*val
})
console.log(temp);
forEach、map都是ECMA5新增數(shù)組的方法,所以ie9以下的瀏覽器還不支持 5,for-of遍歷 是ES6新增功能 for( let i of arr){
console.log(i);
}
for-of循環(huán)不僅支持?jǐn)?shù)組,還支持大多數(shù)類數(shù)組對(duì)象,例如DOM NodeList對(duì)象。 for-of循環(huán)也支持字符串遍歷 JS對(duì)象遍歷:1,for-in遍歷 for-in是為遍歷對(duì)象而設(shè)計(jì)的,不適用于遍歷數(shù)組。 遍歷數(shù)組的缺點(diǎn):數(shù)組的下標(biāo)index值是數(shù)字,for-in遍歷的index值"0","1","2"等是字符串 for (var index in arr){
console.log(arr[index]);
console.log(index);
}
|
|
來(lái)自: melodyjian > 《html》