javascript之遍历数组及对象

var arr = [18,20,26];
var obj = {name:"xiaohong",sex:"f",age:"18"};

for 可用于数组的遍历

for(var i=0;i<arr.length;i++){
   //i为index
    console.log(i+':'+arr[i]);
}

for in/for of 遍历

for in 会遍历对象所有可枚举的属性，包括prototype的，可通过hasOwnProperty（）来过滤，使得只有私有属性被遍历

for(var key in obj){
    //遍历key
    if（obj.hasOwnProperty(key)）{
        console.log(key+':'+obj[key]);
    }
}

for of 用于遍历所有可遍历（有Symbol.iterator属性）的collection的数值

//用于数组遍历
for(var val of arr){
    console.log(val); 
}


//用于对象属性值遍历,这里的对象必须是iterable的

 for(var val of obj){
        console.log(val); 
    }

or 

  for(var [key,val] of obj){
        //遍历key & value
        console.log(key+":"+val); 
  }
    

Note： for...of适合用来遍历数组，for…in也可用于遍历数组，但是如果通过Array.prototype.xxx为Array原生对象添加了属性，则会在该遍历中被读到。

foreach，map,filter，reduce 用于数组遍历

foreach 用于数组遍历，无返回值

arr.foreach(function(value,index,thisArray){
    //三个参数，分别为索引，值，当前array
    console.log(index+':'+value);
});

map和filter会返回一个新的数组

var newArr = arr.map(function(value,index,thisArray){
    //三个参数，分别为索引，值，当前array
    return value*2;
});

var newArr = arr.filter(function(value,index,thisArray){
    //三个参数，分别为索引，值，当前array
    return value>100;    //根据return为false或true来决定是否留下当前元素
});

reduce会返回一个累加值

    var sum = arrreduce.reduce(function(previousValue, currentValue, currentIndex, thisArray) {
          return previousValue + currentValue;
    });
    
    

Note: 以上函数都可以用箭头函数书写，例如reduce：

  var sum = arrreduce.reduce((previousValue, currentValue) => previousValue + currentValue);

使用iterator进行遍历

主要是通过iterator的next()函数进行遍历，需要定义generator和[Symbol.iterator]属性。