数组常见的9个遍历方法,你都知道哪些呢?

本文详细介绍了JavaScript中数组的9种遍历方法,包括forEach、map、filter、some、every、find、findIndex、reduce和indexOf,讲解了它们的使用和区别,帮助提升对数组操作的理解。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

数组的遍历方法可以说是很常用了,接下来一起来盘点一下都有哪些方法可以实现遍历吧。

首先是大家都很熟悉的for循环啦。

1、for循环
let arr = [1,2,3,4]
// item:当前每一项
for (let i = 0; item<=arr.length; item++ ) {
    console.log(item)
 }
2、forEach()

forEach()方法接收一个回调函数(这里我用的是箭头函数的方法),参数有三个,分别是每一项,当前项的索引、以及原数组。forEach()函数没有返回值。

  let arr = [1,2,3,4]
  // item:当前项,index:当前索引,arr:原数组
  arr.forEach((item, index, arr)=> {
     console.log(item, index, arr);
  })
3、map()

map()不改变原数组,可以在函数内部做一些操作,返回处理后的数组。

let arr = [1,2,3,4]
 // item:当前项,index:当前索引,arr:原数组
const result  = arr.map((item, index, arr)=> {
      if(item >2) {
        return item
      }
    })
    console.log(result);

需要注意的是:调用map()一定要把结果 return出来。如果没有 return, 则返回undefined

4、some()

some()用于判断数组有没有满足条件,如果有其中一项满足,就返回true。只有全部都不满足,才会返回false。 它不会改变原数组。

let arr = [1,2,3,4]
// item:当前项,index:当前索引,arr:原数组
const result = arr.some((item, index, arr) => {
    return item <3
 })
console.log(result); // true
5、 every()

every 方法,也是用于判断是否符合条件,他只有全部都满足,才会返回**true**, 一旦其中某一项不符合条件,就中断循环,直接返回 false。它也不会改变原数组。

let arr = [1,2,3,4]
 // item:当前项,index:当前索引,arr:原数组
const result = arr.every((item, index, arr) => {
   return item > 0
})
console.log(result);// true

some()every 的区别:
相同点:
都是在遍历的过程中,判断数组中是否有符合条件的,满足返回true, 不会再对后面的元素进行判断。
不同点:

  • some()方法是只要其中一项满足就返回true
  • every方法:全部都满足条件,才返回true
6、find()

find()方法,用于查找数组中是否有满足条件的元素,当找到第一个满足条件的元素时,则直接返回该元素。如果都不满足条件,则返回 undefined。不会改变原数组。

let arr = [1,2,3,4]
 // item:当前项,index:当前索引,arr:原数组
 const result = arr.find((item, index, arr) => {
 	return item <3
  })
console.log(result); //1
7、filter()

filter()方法:用于过滤的方法,但是也可以遍历数组,它返回符合条件的新数组,不会影响原数组。

let arr = [1,2,3,4]
 // item:当前项,index:当前索引,arr:原数组
const result = arr.filter((item, index, arr) => {
   return item <3
})
console.log(result); //  [1, 2] 
8、reduce()

reduce()方法,一般用于求和,它是一个比较特殊的方法,一共有四个参数。
reduce()方法最重要的作用就是累加的操作,将数组的每个元素从左往右依次执行累加器,返回最终的处理结果。不会影响原数组。

let arr = [1,2,3,4]
// sum:上一次的值,item:当前值,index:当前索引,arr:原数组
const result = arr.reduce((sum, item, index, arr) => {
  return sum += item
  }, 0)
// 这里的0,是一个初始值,意思是从0开始计算
// 因为我这里做的是加法运算,所以返回的是累加的和
 console.log(result); // 10
9、 findIndx()

findIndx():与find 类似,只不过findIndx()查找的是索引,找到符合条件的返回当前项的下标,没找到返回 -1

let arr = [1,2,3,4]
// item:当前项,index:当前索引,arr:原数组
const result = arr.findIndex((item, index, arr) => {
  return item>3
 })
console.log(result); //3

好了,看到这里已经很不容易啦。恭喜你又进步了。继续加油吧!!

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值