for...in根據key遍歷
for...in區別:
遍歷對象時會從原型上繼承屬性,可以用hasOwnProperty()識別出繼承屬性,
遍歷數組會把數組下標看做屬性名,也就輸出結果是數組的下標,且不一定按照數組的索引順序。
輸出結果是字符串
function Person(name){
this.name = name;
}
Person.prototype.getName = function(){
return this.name;
}
var child= new Person('lala');
for (let i in child){
console.log(i);
}
//name
//getName
for (let i in child){
if(child.hasOwnProperty(i)){
console.log(i);
}
}
//name
var aa = ['aa','bb','cc'];
for(let i in aa){
console.log(i);
}
// 0 1 2
for...of根據值遍歷
for...of用來遍歷數據,例如數組中的值,但是也可以遍歷字符串,支持Map和Set對象的遍歷,避免了所有for...in的弊端,與forEach相比可以正確響應break,continue,return語句。
var aa = ['aa','bb','cc'];
for(let i of aa){
console.log(i);
}
// aa bb cc
var str='abc';
for(let i of str){
console.log(i);
}
// a b c
var set=new Set(['aa','bb','cc']);
for(let i of set){
console.log(i);
}
//aa bb cc
forEach根據index遍歷
forEach一般只能適用於數組,功能是從頭到尾把數組遍歷一遍,可以有三個參數,后兩個可以不寫
var arr = ['aa','bb'];
arr.forEach(function(v,i,a){
console.log(v,i,a);//分別對應:數組元素,元素的索引,數組本身
});
//aa 0 ['aa','bb']
//bb 1 ['aa','bb']
講真基礎還是需要多練習,聽說forEach是for循環的加強版,就想自己去實現下,結果想的有些復雜了還沒做出來,於是百度了下,居然那么簡單。
Array.prototype.eachFor = function(fn){
for(let i=0;i<this.length;i++){
fn(this[i],i,this);
}
}
var aa=[5,6,7];
aa.eachFor(function(v,i){
console.log(v,i);
});
//5 0
//6 1
//7 2
map根據index遍歷
和forEach相比,使用方法一樣有三個參數,map只能對元素進行加工處理,產生一個新的數組對象。
var arr=[1,2,3];
arr.map(function(v,i,arr){
return v*2;
});
//[2,4,6]
filter
filter對原數組進行過濾篩選,生成新的數組,使用和map樣有三個參數。如果對空數組進行篩選,會返回undefined。filter不會改變原數組。
var aa=[1,2,1,2,3];
aa.filter(function(v,i,self){
return self.indexOf(v) == i;
});
//[1,2,3]
for
for常規語句遍歷,可循環數字,字符串,數組
for(let i=0;i<5;i++){
console.log(i);
}
//0 1 2 3 4

