js数组中的reduce方法

文章类型:Javascript

发布者:hp

发布时间:2023-05-11

一:定义

reduce() 方法可以对数组中的每个元素依次执行指定的 reducer 函数,并将其结果汇总为一个单一的值

accumulator:累加器,初始值可以在 reduce() 方法的第二个参数中指定,也可以使用数组的第一个元素作为初始值。

currentValue:当前元素。

currentIndex:当前元素的索引。

array:原始数组。

const arr = [1, 2, 3];
const sum = arr.reduce((accumulator, currentValue) => accumulator + currentValue, 0);
console.log(sum); // 6

二:适用场景

1:数组过滤

const arr = [1, 2, 3, 4, 5];
const filteredArr = arr.reduce((accumulator, currentValue) => {
  if (currentValue % 2 === 0) {
    accumulator.push(currentValue);
  }
  return accumulator;
}, []);
console.log(filteredArr); // [2, 4]

2:数组查找

const arr = [1, 2, 3, 4, 5];
const searchedValue = 3;
const searchedIndex = arr.reduce((accumulator, currentValue, currentIndex) => {
  if (currentValue === searchedValue) {
    return currentIndex;
  } else {
    return accumulator;
  }
}, -1);
console.log(searchedIndex); // 2

3:数组去重

const arr = [1, 2, 2, 3, 4, 4, 5];
const uniqueArr = arr.reduce((accumulator, currentValue) => {
  if (!accumulator.includes(currentValue)) {
    accumulator.push(currentValue);
  }
  return accumulator;
}, []);
console.log(uniqueArr); // [1, 2, 3, 4, 5]

4:数组排序

const arr = [5, 3, 2, 4, 1];
const sortedArr = arr.reduce((accumulator, currentValue) => {
  if (accumulator.length === 0) {
    accumulator.push(currentValue);
  } else {
    let index = accumulator.findIndex(item => item > currentValue);
    if (index === -1) {
      accumulator.push(currentValue);
    } else {
      accumulator.splice(index, 0, currentValue);
    }
  }
  return accumulator;
}, []);
console.log(sortedArr); // [1, 2, 3, 4, 5]

三:总结

1:reduce() 方法是一个纯函数,因此使用它能够使我们的代码更加简洁、可读和可维护

2:reduce() 方法本身是一个高阶函数,可以接收一个函数作为参数,这个函数可以用来进行更加复杂的操作