从一系列成分创建购物清单（格式化为对象）答案

【问题标题】：Creating a shopping list from an array of ingredients (formatted as objects)从一系列成分创建购物清单（格式化为对象）
【发布时间】：2018-12-16 02:26:02
【问题描述】：

var ingredients = [ 
  { name: 'potatoes', quantity: 4 },
  { name: 'butter', quantity: 1 },
  { name: 'milk', quantity: 1, description: '1 cup' },
  { name: 'potatoes', quantity: 3 },
  { name: 'oil', quantity: 1, description: '3 cups' } ];

const shoppingList = [];

for (let i = 0; i < ingredients.length; i ++) {
  for (let j = 0; j < shoppingList.length; j ++){
    let ingredient = ingredients[i];
    let shoppingListItem = shoppingList[j];
    if(ingredient === shoppingListItem){
      break;
    }else if (roughDraftItem.name === shoppingListItem.name){
      shoppingListItem.quantity += roughDraftItem.quantity;
      } else {shoppingList.push(roughDraftItem);
        }
    }
  }

当我运行此代码时， shoppingList 数组返回为空。当我取出第二个循环时，代码没有问题，我得到了我需要的东西

shoppingListItem = { name: 'potatoes', quantity: 1}

尝试将成分数组与 shoppingList 数组进行比较似乎是一个问题（在添加对象之后）。

【问题讨论】：

内部循环根本不会运行，因为shoppingList 以length 为0，而0 < 0 是false。

标签： javascript arrays for-loop javascript-objects

【解决方案1】：

您的shoppingList 是空的，所以它的length = 0。数组的第二个循环没有运行，因为它被告知运行0 次。

您不需要第二个循环将对象添加到shoppingList，因此我将其删除。

【讨论】：

【解决方案2】：

正如其他人所说，shoppingList 以长度 0 开头，因此第二个循环永远不会运行。另外，如果你想对同名项目的数量求和，你可以使用reduce 来简化事情：

const ingredients = [ 
  { name: 'potatoes', quantity: 4 },
  { name: 'butter', quantity: 1 },
  { name: 'milk', quantity: 1, description: '1 cup' },
  { name: 'potatoes', quantity: 3 },
  { name: 'oil', quantity: 1, description: '3 cups' } ];
  
const result = ingredients.reduce((acc, curr) => {
  const exists = acc.find(item => item.name === curr.name);
  if (exists) {
    exists.quantity += curr.quantity;
    return acc;
  }
  return [...acc, curr]
}, []);

console.log(result);

【讨论】：

谢谢！快速的问题是 [...acc, curr] 是什么意思？我不明白 ... 语法，因为我不知道它的名称，所以我的谷歌搜索没有找到答案
另外，我看到了 reduce 将如何与这个数组一起工作，因为只有土豆是重复的。但是，如果我有多个重复项，它会起作用吗？（即两种黄油、两种牛奶等）
acc 和curr 参考accumulator and current value

【解决方案3】：

您可以使用 Array.prototype.reduce 和 ES6 对象解构赋值来按名称聚合成分，并使用 Array.prototype.map 生成所需的输出：

此解决方案比嵌套的 for 循环更具声明性，并且可以处理任意数量的重复项：

var ingredients = [ 
  { name: 'potatoes', quantity: 4 },
  { name: 'butter', quantity: 1 },
  { name: 'milk', quantity: 1, description: '1 cup' },
  { name: 'potatoes', quantity: 3 },
  { name: 'oil', quantity: 1, description: '3 cups' }
];

// Aggregate `quantity` by `name`
var dataObj = ingredients.reduce((all, {name, quantity}) => {
    all[name] = (all[name] || 0) + quantity;
    return all;
}, {});

// Generate the result
var shoppingList = Object.keys(dataObj).map(ing => ({name: ing, quantity: dataObj[ing]}));

console.log(shoppingList);

【讨论】：