JS数组与对象的遍历方法大全

本文主要介绍数组和对象属性的遍历方法：

1. for-in和for-of
2. map和forEach区别
3. Object.keys()
4. getOwnPropertyNames()

一、for-in和for-of

1.for-in循环是为了遍历对象而设计的，事实上for-in也能用来遍历数组，但定义的索引i是字符串类型的。如果数组具有一个可枚举的方法，也会被for-in遍历到

2.ES6中，新增了for-of遍历方法。它被设计用来遍历各种类数组集合，例如DOM NodeList对象、Map和Set对象，甚至字符串也行。

 

var obj={
        "name":"kebi",
        "age":40
  　}
var arr=["小明"，"小红"，"小黄"]
1.for-in
for(var index in obj){
　　console.log(index)          //打印 name age 
　　console.log(obj[index])     //打印 kebi 40
}

2.for-of
for(var value in arr){
  console.log(value)           //打印 小明 小红 小黄
}
// for-of遍历字符串
let iterable = "happy";
for (let value of iterable) {
  console.log(value)              //打印 h a p p y
}

  二、map和forEach区别

1.forEach()方法不会返回执行结果，而是undefined。（IE9以下不支持）不能使用break语句中断循环，也不能使用return语句返回到外层函数。

2.map()方法会得到一个新的数组并返回，map遍历支持使用return语句，支持return返回值（IE9以下不支持）

1.forEach
arr.forEach((item,index)=>{
    console.log(index+":"+item)     //打印 0:小明 1:小红 2:小黄
})
2.Map
var returnArr=arr.map((item,index)=>{
    return item+"1"
})
console.log(returnArr)             //打印 ["小明1", "小红1", "小黄1"]            

 

三、Object.keys()

1.使用Object.keys()遍历 返回一个数组,包括对象自身的(不含继承的)所有可枚举属性(不含Symbol属性).

Object.keys(obj).forEach(function(key){
    console.log(key +"   "+ obj[key])
        //打印 name kebi  age 40     
})

 

四、Object.getOwnPropertyNames() 

1.Object.getOwnPropertyNames()方法返回对象的所有自身属性的属性名（包括不可枚举的属性）组成的数组，但不会获取原型链上的属性。

Object.getOwnPropertyNames(obj).forEach(function(key){
    console.log(key +"   "+ obj[key])
         //打印 name kebi  age 40   
})