使用散布运算符重构遍历对象数组

时间:2019-09-21 17:54:12

标签: javascript destructuring

    function main() {
 
     let yesterdaysOrders = [
 
      {
        id: 1,
        orderLines: [{
            itemName: "Item 01",
            quantity: 1
          },
          {
            itemName: "Item 02",
            quantity: 3
          },
          {
            itemName: "Item 03",
            quantity: 25
          },
          {
            itemName: "Item 04",
            quantity: 12
          },
        ],
      },
      {
        id: 2,
        orderLines: [{
            itemName: "Item 01",
            quantity: 1
          },
          {
            itemName: "Item 08",
            quantity: 42
          },
          {
            itemName: "Item 09",
            quantity: 13
          },
          {
            itemName: "Item 12",
            quantity: 37
          },
        ],
      },
      {
        id: 3,
        orderLines: [{
          itemName: "Item 12",
          quantity: 16
        }, ],
      },
      {
        id: 4,
        orderLines: [{
            itemName: "Item 10",
            quantity: 11
          },
          {
            itemName: "Item 11",
            quantity: 10
          },
        ],
      },
      {
        id: 5,
        orderLines: [{
            itemName: "Item 06",
            quantity: 7
          },
          {
            itemName: "Item 07",
            quantity: 2
          },
          {
            itemName: "Item 12",
            quantity: 14
          },
        ],
      },
      {
        id: 6,
        orderLines: [{
          itemName: "Item 05",
          quantity: 17
        }, ],
      },
      {
        id: 7,
        orderLines: [{
            itemName: "Item 03",
            quantity: 5
          },
          {
            itemName: "Item 07",
            quantity: 2
          },
        ],
      },
      {
        id: 8,
        orderLines: [{
            itemName: "Item 02",
            quantity: 13
          },
          {
            itemName: "Item 07",
            quantity: 7
          },
          {
            itemName: "Item 09",
            quantity: 2
          },
        ],
      },
      {
        id: 9,
        orderLines: [{
            itemName: "Item 01",
            quantity: 4
          },
          {
            itemName: "Item 06",
            quantity: 17
          },
          {
            itemName: "Item 07",
            quantity: 3
          },
        ],
      },
      {
        id: 10,
        orderLines: [{
            itemName: "Item 11",
            quantity: 12
          },
          {
            itemName: "Item 12",
            quantity: 1
          },
        ],
      }
    ],
 
    result = Array.from(
      yesterdaysOrders.reduce((acc, {
        orderLines
      }) => {
        orderLines.forEach(({
          itemName,
          quantity
        }) => acc.set(itemName, (acc.get(itemName) || 0) + quantity));
        return acc;
      }, new Map), ([itemName, quantity]) => ({
        itemName,
        quantity
      }));
}

我具有此功能,最后,我要获取itemName和数量,以便最终可以在DOM中显示它们。

我希望重构result = Array.from....以便与扩展运算符一起使用,以及已经实现的解构。

我将如何开始呢?

我了解,传播运算符允许将所有可迭代的内容扩展。

此外,在main函数中,放置逗号并用result定义新函数后,不需要varlet的解释是什么? ,或之前的const

0 个答案:

没有答案