js中数组的遍历方法有哪些

109 阅读2分钟

前言

在开发中,我们的数据经常会以数组的形式进行保存,我们可以拿到数组每个元素或者每个元素进行某种操作的时候就需要使用遍历,以及在面试中也可能问到数组的遍历的方式有哪些,所以针对数组遍历的话呢,在这里给大家列举了几个方法,下面讲的实际开发中比较常用的

forEach

forEach特点是不会改变原数组,没有返回值

var arr=[1,2,3,4,5]
// 这里有三个参数,遍历值,索引值,数组本身
arr.forEach((item,index,arr)=>{
console.log(item);//1
console.log(index);//0
console.log(arr);//[1,2,3,4,5]
})

map

map的用法和forEach很相似也是不会改变原数组,但是有返回值

var arr=[1,2,3,4,5]
// 这里有三个参数,遍历值,索引值,数组本身
let resultMap=arr.map((item,index,arr)=>{
console.log(item);//1
console.log(index);//0
console.log(arr);//[1,2,3,4,5]
return index
})
console.log(resultMap)//[0,1,2,3,4]

可以看到map是有返回值的,返回值是以数组的形式返回

filter

充当一个过滤器的作用,所以主要是用来过滤数组,当然也是可以遍历数组的,有返回值,并且返回包含符合过滤条件的数组,比如我想拿到大于3的数组,就可以这样写

var arr=[1,2,3,4,5]
let  resultFilter=arr.filter((item)=>{
  return item>3
})

for of

返回的是数组的元素,对象的属性值。不能遍历普通的对象,因为普通对象是没有迭代器属性的,用for...of是跟我们的迭代器有关系的,所以就不能遍历普通的对象

for(let value of arr){
  console.log(value)
}

reduce

接收一个函数,作为一个累加器 函数有两个参数,第一个计算之后返回的值或者初始值,第二个当前的元素

let resuotReduce=arr.reduce((pre,item)=>{
  console.log(pre)
  console.log(item)
  retrun pre+item
},0)//默认初始值0