js的reduce方法(JavaScript数组迭代方法——reduce函数)

什么是reduce方法?

Reduce方法是JavaScript中处理数组的reduce()方法之一。 在计算总和，特定操作或过滤数组元素时，非常有用。

reduce()方法的工作方式是，对数组中的每个元素应用提供的函数，并将结果缩减为单个值。 reduce()方法需要两个参数，第一个参数是回调函数，第二个参数是可选的初始值。

reduce()的基本语法

array.reduce(callback, [initialValue])

callback: 必须。 用于处理每个数组元素的函数。

initialValue: 可选。 用于初始值的累加器。如果未提供初始值，则使用数组中的第一个元素，然后从第二个元素开始迭代。

reduce()的使用方法

我们来看一个使用reduce()的例子。 假设我们有一个数组，希望计算数组中所有元素的总和。 我们可以使用reduce()方法迭代数组并将其所有元素相加。

  

    const arr = [1, 2, 3, 4, 5];
    const sum = arr.reduce((accumulator, currentValue) => accumulator + currentValue);
    console.log(sum); // 输出15
  

在上面的代码中，reduce()方法将累加器初始化为0，然后使用箭头函数对数组中的每个元素进行求和。 最终，reduce()方法返回累加器的值并将其存储在sum变量中。

reduce()与map()和filter()的比较

reduce()方法与map()和filter()方法一起使用可能会更强大和灵活。 map()方法可以用于修改数组中的每个元素，而filter()方法用于选择需要保留或删除的元素。

在下面的例子中，我们将使用map()方法将数组中的每个元素加倍，然后使用filter()方法删除小于10的元素，最后使用reduce()方法将所有元素相加。

  

    const arr = [1, 2, 3, 4, 5];
    const sum = arr.map(x => x * 2)
                  .filter(x => x > 10)
                  .reduce((accumulator, currentValue) => accumulator + currentValue);
    console.log(sum); // 输出30
  

在上面的代码中，我们首先使用map()方法将数组中的每个元素加倍，然后使用filter()方法删除小于10的元素。 最后，我们使用reduce()方法将所有元素相加并将结果存储在sum变量中。

reduce()方法的高级用法

除了上述基本用法之外，reduce()方法还可以用于各种高级用途。

计算平均值

  

    const arr = [1, 2, 3, 4, 5];
    const average = arr.reduce((accumulator, currentValue, index, array) => {
                      accumulator += currentValue;
                      if (index === array.length - 1) {
                        return accumulator / array.length;
                      } else {
                        return accumulator;
                      }
                    });
    console.log(average); // 输出3
  

在上面的代码中，我们将累加器初始化为0，并在每次迭代中将当前值添加到累加器中。 最后，如果迭代达到数组的最后一个元素，则将累加器的值除以数组的长度并返回平均值。

从对象数组中获取唯一值

  

    const arr = [{name: 'John Doe', age: 25}, {name: 'Jane Smith', age: 30}, {name: 'John Doe', age: 35}];
    const uniqueNames = arr.reduce((accumulator, currentValue) => {
                          if (!accumulator.includes(currentValue.name)) {
                            accumulator.push(currentValue.name);
                          }
                          return accumulator;
                        }, []);
    console.log(uniqueNames); // 输出['John Doe', 'Jane Smith']
  

在上面的代码中，我们将累加器初始化为一个空数组，并在每次迭代中检查当前元素的属性是否已经存在于累加器中。如果不存在，则将它添加到累加器中。最后，我们得到了一个唯一的名称数组。

结论

reduce()方法是JavaScript中处理数组的强大工具之一。 它可以用于各种用途，包括计算总和，平均值，选择唯一值等。 reduce()方法可以与JavaScript中的map()和filter()方法一起使用，从而实现更大的灵活性。