遍历数组或对象的常用方式有for、for-in、for-of、forEach和map
const arr = [1,2,3,4,5]
const obj = {
id:1,
name:'tom',
age:18
}
const str = "abc"
1. for
使用for循环是最基本的遍历方式
遍历的是索引
for(let i = 0;i<arr.length;i++){
console.log(arr[i]); //1 2 3 4 5
}
for(let i = 0;i<str.length;i++){
console.log(str[i]); //a b c
}
2. for-in
遍历数组和字符串遍历的是索引,遍历对象遍历的是键
for(let i in arr){
//遍历索引
console.log(arr[i]); //1 2 3 4 5
}
for(let i in str){
//遍历索引
console.log(str[i]); //a b c
}
for(let i in obj){
//遍历键
console.log(i,obj[i]);
//id 1
//name tom
//age 18
}
3. for-of
可以遍历可迭代对象,不可遍历对象
遍历的是值
for(let i of arr){
console.log(i); //1 2 3 4 5
}
for(let i of str){
console.log(i); //a b c
}
4. forEach和map
两者用法差不多,都是遍历数组的方法
且都可以传递三个参数,第一个为当前项,第二个为索引,第三个为原数组。后两个参数可省略。
forEach
没有返回值,返回的结果为undefined。除了抛出异常以外,没有办法中止或跳出循环。
map
有返回值,每个元素都按顺序调用一次callback函数,返回一个新数组。
两个方法都不会修改原数组。
let arr = [2,5,8,4,9]
let res1 = arr.forEach(item=>item*2)
console.log(res1); //undefined
console.log(arr); //[ 2, 5, 8, 4, 9 ]
let res2 = arr.map(item=>item*2)
console.log(res2) //[ 4, 10, 16, 8, 18 ]
console.log(arr); //[ 2, 5, 8, 4, 9 ]
如果想要修改原数组的话,可以通过索引的方式进行修改。
let res3 = arr.forEach((item,index,input)=>{
input[index] = item*2
})
console.log(arr); //[ 4, 10, 16, 8, 18 ]
let res4 = arr.map((item,index,input)=>{
input[index] = item*2
})
console.log(arr); //[ 8, 20, 32, 16, 36 ]