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
这个方法执行是没有返回值的,主要用来遍历数组中的每一项,对原来数组也没有影响