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


纠错反馈