index参数如何在Javascript的reduce.method中工作

如何解决index参数如何在Javascript的reduce.method中工作

我试图了解reduce方法，但是我陷入了困境。如果我写：

const myArr = [1,2,3,4,7,5];


const sum = myArr.reduce((acc,el)=>{
return acc+el

});


console.log(`The sum is ${sum}`);

我得到正确的输出22，这是我的总和。

但是如果我这样写：

const items = [{
name: "Bike",price: 100
},{
name: "TV",price: 200
},{
name: "Album",price: 10
},{
name: "Book",price: 5
},{
name: "Phone",price: 500
},{
name: "Computer",price: 1000
}
]


const total = items.reduce((acc,el) => {
  return acc + el.price
});


console.log(total);

除非将索引初始化为0，否则我不会得到总数。我不明白为什么在第一种情况下它起作用，但在第二种情况下却不起作用。谢谢您的帮助！

解决方法

.reduce函数似乎在开始知道要执行的操作（可能是数学或字符串操作）之前，先将正在循环的第一个元素的类型分配给“ acc”。您正在尝试数学。

在第一种情况下，类型是数字，所以一切都很好，但是在第二种情况下，它是一个对象。因此，在第二种情况下，您正在向对象（{名称：“自行车”，价格：100}）添加数字（el.price），从而将其转换为字符串。从这里开始，您将只是连接字符串，而不是做数学。

通过将acc设置为0，您可以为其重新分配数字类型，因此它可以正常工作。

因此，我认为最好始终在reduce函数中分配acc以避免此类错误。

将reducer函数的返回值（在本例中为const reducer = ...）分配给累加器，并且在每次迭代中都会“记住”它，因此，如果您尝试这种方式：

const reducer = (accumulator,currentValue) => ({ 
  price: accumulator.price + currentValue.price 
});

items.reduce(reducer);

// console.log outputs { price: 1815 }

因为要处理对象，所以需要返回一个对象，因为如果仅返回(acc,cur) => acc.price + cur.price，则会收到NaN错误，因为数字与对象不兼容（并将reducer函数的返回赋给了累加器）。

检查这些控制台日志，我相信它们将帮助您了解reducer的状况：

请注意，reducer第一次运行累加器是数组的索引0。

如果您在下面的评论中还有其他问题，请告诉我。