js中遍历对象和数组的方法

js遍历对象的方法：

第一种方法：for in

let obj = { 
         name: 'lulu', 
         id: 1, 
         age: 18 
}
for (let key in obj) {
	console.log( key + ':' + obj[key] )
}

// 输出结果
//  name:lulu
//  id:1
//  age:18

第二种方法：Object.keys(obj)、Object.values(obj)

const obj = {
　　　　id:2,
　　　　name:'zhang',
　　　　age:19
}

 console.log(Object.keys(obj))
//  ["id" , "name" , "age"]
console.log(Object.values(obj))
//   [2, 'zhangsan', 18]

第三种：Object.getOwnPropertyNames(obj)

const obj = {
            id:3,
            name:'huahua',
            age:20
    }
    Object.getOwnPropertyNames(obj).forEach(function(key){
        console.log(key+ ':'+obj[key])
    })
    // 输出结果
    //  id:3
	//  name:huahua
	//  age:18

js遍历数组的方法：

第一种方法：for in

let arr = [1,2,3,4,5,6]
for (let i in arr) {
	// console.log(i) // 0,1,2,3,4,5 打印索引值
	console.log(arr[i])  // 1,2,3,4,5,6 打印值
}

第二种方法：for

let arr = [1,2,3,4,5,6]
for(let i=0; i<arr.length; i++) {
	console.log(arr[i])    //1,2,3,4,5,6 
}

第三种方法：forEach

遍历普通类型的数组
let arr = [1,2,3,4,5,6]
arr.forEach((item, index) => {
	console.log(item, index) 
})
// 输出结果：
1,0
2,1
3,2
4,3
5,4
6,5

遍历对象类型的数组
let arr = [
            {id:1,name:'zhangsan'},
            {id:2,name:'lisi'},
            {id:3,name:'wangwu'}
        ]
arr.forEach((item) => {
    console.log(item.id + '---' +  item.name)
})
// 输出结果：
1---zhangsan
2---lisi
3---wangwu

第四种方法：map

let arr = [1,2,3,4,5,6]
let newArr = arr.map((value) => {
	return value + 1;
})
console.log(newArr)
// 打印结果
[2,3,4,5,6,7]

forEach和map的区别：

map的回调函数中支持return返回值，相当于把数组中的这一项变成想要的样子。（并不影响原来的数组，只是相当于把原数组克隆一份，把克隆的这一份的数组中的对应项改变了）

forEach这个方法执行是没有返回值的，主要用来遍历数组中的每一项，对原来数组也没有影响