likes
comments
collection
share

js数组中常用的“冷门”方法:find,every,some,reduce

作者站长头像
站长
· 阅读数 61

find,every,some,reduce

1-find方法

查找数组中符合条件的第一个元素,并返回该元素的值。如果没有符合条件的元素,则返回undefined。因此,在使用find方法时,需要先判断返回值是否为undefined,再进行后续操作。

const arr = [
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' },
  { id: 3, name: 'Charlie' }
];
const targetId = 2;
const targetObj = arr.find(obj => obj.id === targetId);
if (targetObj !== undefined) {
  console.log(targetObj.name);
} else {
  console.log('Not found');
}

需要注意的是,如果我们在使用targetObj时没有进行判断,而是直接访问其属性,那么在没有找到符合条件的对象时,会抛出TypeError异常,因为undefined是不能访问属性的。因此,在使用find方法时,一定要先判断返回值是否为undefined

2-some方法

判断数组中是否存在符合条件的元素。如果存在,则返回true,否则返回false

const arr = [1, 2, 3, 4, 5];
const result = arr.some(item => item > 3);
console.log(result); // true

在上面的代码中,我们定义了一个数组arr,然后使用some方法判断数组中是否存在大于3的元素。由于数组中存在符合条件的元素,所以some方法返回true

注:findsome方法都是遇到符合条件的元素的元素就返回,不再检测后续元素,而find方法是返回元素本身,some方法是返回true

3-every方法

判断数组中的所有元素是否都符合条件。如果都符合,则返回true,否则返回false

const arr = [1, 2, 3, 4, 5];
const result = arr.every(item => item > 0);
console.log(result); // true

在上面的代码中,我们定义了一个数组arr,然后使用every方法判断数组中的所有元素是否都大于0。由于数组中所有元素都大于0,所以every方法返回true

4-reduce方法

用于将数组中的元素通过一个函数(回调函数)进行累加,最终返回一个值。该函数接收四个参数:

  • accumulator (累计器):累计器累加回调函数的返回值,它是上一次回调函数执行后的返回值,或者是初始值(initialValue)。
  • currentValue (当前值):当前正在处理的数组元素。
  • currentIndex (当前索引):当前正在处理的数组元素的索引,从 0 开始。
  • array (原数组):调用 reduce() 方法的原数组。 回调函数的返回值将作为下一次函数调用的 accumulator 参数的值,直到数组中的所有元素都被遍历完毕,最终返回累积的结果值。
const arr = [1, 2, 3, 4, 5];
const sum = arr.reduce((prev, curr) => prev + curr, 0);
console.log(sum); // 15

回调函数中的第一个参数 prev 表示上一次回调函数执行后的返回值或者是初始值,第二个参数 curr 表示当前正在处理的数组元素。在每次回调函数执行时,prev 的值都会被累加上当前元素的值,最终得到数组的总和。

除了计算数组元素的总和外,reduce() 方法还可以用于计算数组元素的平均值、最大值、最小值等。

转载自:https://juejin.cn/post/7216526817372946489
评论
请登录