一个键的对象的Sum数组在JavaScript中返回超过2个项目的NaN

Question

以下是我的阵列 -

const products = [{
  id: "1",
  quantity: 3
}, {
  id: "2",
  quantity: 3
}]

console.log(products.reduce((acc, product) => acc.quantity + product.quantity)) // 6 -> Correct

但是如果数组包含超过2个项目,那么它就会抛出NaN,让我知道我在这里做错了什么.

const products = [{
  id: "1",
  quantity: 3
}, {
  id: "2",
  quantity: 3
}, {
  id: "3",
  quantity: 4
}]
console.log(products.reduce((acc, product) => acc.quantity + product.quantity)) // NaN -> InCorrect

Answer 1

默认情况下,累加器的初始值是数组中的第一个元素.如果第一个元素是一个对象,那么将向该对象添加任何内容NaN.

只需提供另一个参数来reduce为累加器提供初始值,并确保累加器记录总和:

const products = [{
  id: "1",
  quantity: 3
}, {
  id: "2",
  quantity: 3
}, {
  id: "3",
  quantity: 4
}];

const total = products.reduce((acc, product) => acc + product.quantity, 0);
console.log(total);

如果你真的想让累加器存储一个对象,你可以这样做,但它会改变数组中的第一个元素,你必须确保访问相应的属性才能记录它:

const products = [{
  id: "1",
  quantity: 3
}, {
  id: "2",
  quantity: 3
}, {
  id: "3",
  quantity: 4
}]
console.log(products.reduce((acc, product) => {
  acc.quantity += product.quantity;
  return acc;
}).quantity) 

但这是一个非常糟糕的主意.

Answer 2

原因acc是第二次6,acc.quantity未定义.为了解决这个问题,更换acc.quantity与acc和使用0作为起始累加器