快速了解for...in、for...of 、 forEach用法和区别 (array,set,map)

for..of 、 for...in 、 forEach 对数值的用法及区别

• array set map都具有iterator接口
• for..of 遍历数组的每一项
• for..of..循环内部调用的是数据结构的Symbol.iterator方法
• for...of无法遍历对象，for..in..可以

let arr =['n','c','d'];
arr.name='自定义'
for(let item of arr){
    console.log('for..of..:'+item);
}
//for..of..:n  
//for..of..: c  
//for..of..: d  

for..of 输出值 for...in 输出索引值

for(let key in arr){
    console.log('for...in..'+key+':'+arr[key])
}
//for...in..0:n
//for... in ..1: c
//for... in ..2: d
//for... in ..name: 自定义

let brr=[
    {name:'nick',age:18},
    {name:'lucy',age:02},
    {name:'mike',age:11}
];
for(var item of brr){
    console.log('for..of..对象遍历---name:'+item.name+'age:'+item.age);
}
//输出数组每一项
//for..of..对象遍历---name:nickage:18
//for..of..对象遍历-- - name: lucyage: 2
//for..of..对象遍历-- - name: mikeage: 11

let crr={
    name:'justin',
    age:18,
    sex:'boy'
}
for(let item of crr){
  //  console.log('for..of..对象:'+crr.name+crr.age+crr.sex)
}
//输出报错 crr is not iterable
//for..of..不能遍历对象，也是相对于for..in..的区别

for..in..

• array用for..in..会输出索引值index

function Person() {//声明一个类
    this.name="wangzhen";
    this.age=24;
    this.func1=function (params) {   
    }
}
var b=new Person();
for(key in b){
    console.log(b[key]);
}
//输出
//wangzhen
//24
//function (params) {
//    …}

forEach

//array
var a=['a','b','c'];
a.forEach(function(element,index,array){//element,index,array函数参数值不固定可以修改一般不修改
    //element:当前元素值
    //index:当前索引
    //array:array本身
    console.log('array---element:'+element+'-index:'+index+'-array:'+array);
})

//Set
var s=new Set(['set1','s2','s3']);
s.forEach(function (element,same,set) {
    console.log('set---'+element+'+'+same+'+'+set);
})

//Map
var m=new Map([[1,'m1'],[2,'m2'],[3,'m3']]);
m.forEach(function (value,key,map) {
    console.log('map---'+value+'---'+key+'---'+map)
})
for(let item of m){
    console.log(item + '---' + item[1]) //item是map里面的每一项
}
//输出
//1,m1---m1
//2, m2-- - m2
//3, 3-- - 3