ES8 中的 Array.prototype.reduceRight() 方法详解和使用场景

概述

在 ES8 中，Array 原型上新增了一个 reduceRight() 方法，这个方法和 reduce() 操作类似，不同的是它是从右边开始遍历数组。

reduceRight() 方法可以对一个数组从右到左进行归约操作。它所接受的参数和 reduce() 方法一样，它也接收一个归约函数和初始值。

语法

array.reduceRight(callback[, initialValue])

• callback：归约函数，接收四个参数：

  • accumulator：上一次归约处理的结果
  • currentValue：当前数组元素
  • currentIndex：当前数组元素的索引
  • array：数组本身

• initialValue：可选，初始值。

用法

reduceRight() 方法的用法与 reduce() 方法类似，唯一的不同是 reduceRight() 方法的遍历方向是从右向左。

下面来看一个例子，假设我们有一个数组，需要将其从右向左归约，计算数组所有元素的乘积。

const arr = [1, 2, 3, 4];
const product = arr.reduceRight((accumulator, currentValue) => accumulator * currentValue);
console.log(product); // 24

reduceRight() 方法对数组的操作顺序为 [4, 3, 2, 1]，初始值为空，逐个计算每个元素和上一个归约过的值的乘积。最终得到 24。

reduceRight() 方法还可以传入初始值，如果数组是空的，将直接返回初始值。

const arr = [];
const defaultValue = 10;
const sum = arr.reduceRight((accumulator, currentValue) => accumulator + currentValue, defaultValue);
console.log(sum); // 10

上面的代码没有元素，但是设置了默认值为 10，所以 reduceRight() 方法将直接返回默认值。

使用场景

以下是一些使用 Array.prototype.reduceRight() 方法的场景：

反转数组

可以使用 reduceRight() 方法很容易地把一个数组进行反转，同时还可以对数组进行任何其他操作。下面的例子中，reverse() 方法和 reduceRight() 方法一样可以将数组进行反转：

const arr = [1, 2, 3, 4];
const result = arr.reduceRight((accumulator, currentValue) => accumulator.concat(currentValue), []);
console.log(result); // [4, 3, 2, 1]

使用 reduceRight() 方法来实现反转数组虽然没有使用 reverse() 方便，但是 reduceRight() 方法可以更容易地定制操作。

链式操作

reduceRight() 方法可以用于实现一些复杂的数组操作，因为它可以和其他方法一起链式调用。

const arr = [[1, 2], [3, 4], [5, 6]];
const result = arr.reduceRight((accumulator, currentValue) => accumulator.concat(currentValue), []);
console.log(result); // [5, 6, 3, 4, 1, 2]

使用 reduceRight() 方法进行链式操作可以更轻松、更直接地实现对数组的操作。

总结

在 ES8 中，新增的 Array.prototype.reduceRight() 方法可以从右到左对数组进行归约操作。通过 reduceRight() 方法，可以更容易地实现某些复杂操作，比如反转数组和链式操作。在实践中，适时使用 reduceRight() 方法可以简化代码逻辑，提高代码可读性。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65ab25ddadd4f0e0ff4c14e4