英文 | https://javascript.plainenglish.io/javascript-how-to-populate-an-object-with-array-reduce-6faa8eb947d0

Array.reduce() 是一个非常强大的方法。其独特的功能可以灵活地使用该方法。在本文中，我们将讨论如何使用 Array.reduce() 来填充对象。

介绍 Array.reduce()

reduce() 方法允许我们将数组“减少”为单个值。reduce() 方法有两个参数：一个回调函数和一个可选的初始值。为数组中的每个元素调用回调函数。回调函数的返回值用作“累加器”。累加器是 reduce() 返回的值。

回调函数有两个参数：累加器和当前值。当前值是回调函数当前正在处理的元素的值。

如果您提供初始值作为 reduce() 的第二个参数，则初始值将用作累加器的初始值。如果不提供初始值，则数组的第一个元素将用作累加器的初始值。

利用 Array.reduce() 填充对象

如果您曾经需要将数据数组转换为对象，您就会知道这可能有点棘手。但是，Array.reduce() 非常灵活，它的初始值可以为我们所用。

我们可以通过考虑以下示例来观察此功能。假设我们有一个元素数组，它们代表杂货店购物车中的物品。

const shoppingCart = [ 'yogurt', 'banana', 'milk', 'yogurt', 'steak', 'bread', 'bacon', 
'banana', 'banana', 'steak', 'banana', 'banana', 'banana', 'bread'];

如果我们想将此数组转换为一个对象，其中键是数组中的项目，值是相应的项目数量，我们可以使用 Array.reduce() 如下：

const shoppingCartObj = shoppingCart.reduce((acc, cur) => {
  if (!acc[cur]) {
    acc[cur] = 0;
  }
  acc[cur]++;
  return acc;
}, {});


console.log(shoppingCartObj) // { yogurt: 2, banana: 6, milk: 1, steak: 2, bread: 2, bacon: 1 }

在上面的代码中，我们为 reduce() 方法提供了一个空对象的初始值。该对象将用作累加器的初始值。我们还定义了一个回调函数，它接受两个参数：累加器 (acc) 和当前值 (cur)。回调函数首先检查累加器对象中是否存在当前键。如果键不存在，则将其添加到累加器对象中，值为 0。否则，键的值加 1。最后，回调函数返回累加器对象。

结论

在本文中，我们讨论了如何使用 Array.reduce() 来填充对象。我们还看到了如何利用初始值来发挥我们的优势。Array.reduce() 是一种非常强大的方法，可以以多种方式使用。

我希望您能从这篇文章学到一点新的东西，如果您觉得有用的话，请点赞我，关注我，并将它分享给你身边的朋友，也许能够帮助到他。

最后，感谢您的阅读，祝编程愉快！