javascript - 如何在每个循环中对 Json 对象进行分组

标签 javascript jquery arrays foreach

你好,我来自 php 背景,并试图通过 Javascript/JQuery 对一些 JSON 数据进行分组。我想通过裁剪 SKU 并将我已成功完成的记录分组在一起来对数据进行分组,但是我无法将数据放入“子”部分,它似乎只循环第一条记录。理想情况下,子部分应包含 JSON 文件中的所有数据,但按父 SKU 对它们进行分组。

我尝试了以下方法:

var items = [
  {
    product_type: "configurable",
    options: [
      {
        label: "Size",
        value: "7.5",
        option_id: 190,
        option_value: 106
      }
    ],
    qty: 3,
    item_id: "300",
    product_id: "88105",
    product_name: "MENS SHOE TUDOR BLACK",
    product_sku: "M1S-TUD02-AVEL-79-7.5",
  },
  {
    product_type: "configurable",
    options: [
      {
        label: "Size",
        value: "11",
        option_id: 190,
        option_value: 99
      }
    ],
    qty: 3,
    item_id: "298",
    product_id: "88105",
    product_name: "MENS SHOE TUDOR BLACK",
    product_sku: "M1S-TUD02-AVEL-79-11",
  },
  {
    product_type: "configurable",
    options: [
      {
        label: "Size",
        value: "M",
        option_id: 190,
        option_value: 66
      }
    ],
    qty: 1,
    item_id: "111",
    product_id: "99945",
    product_name: "WOMENS SWEATER",
    product_sku: "W1R-613K-A10400-96-M",
  },
  {
    product_type: "configurable",
    options: [
      {
        label: "Size",
        value: "L",
        option_id: 190,
        option_value: 12
      }
    ],
    qty: 20,
    item_id: "278",
    product_id: "99945",
    product_name: "WOMENS SWEATER",
    product_sku: "W1R-613K-A10400-96-L",
  },
];

var groupedItems = {};
$.each(items, function(key, item) {
  if (item.product_type === "configurable") {
    var sku = item.product_sku,
      parentSku = sku.replace(sku.substring(sku.lastIndexOf("-")), "");

    if (sku.indexOf(parentSku) >= 0) {
      groupedItems[parentSku] = {
        product_sku: parentSku,
        product_name: item.product_name,
        product_type: item.product_type,
        children: [item]
      };
    }
  }
});
console.log(groupedItems);
<!DOCTYPE html>
<html>
  <head>
    <title>Parcel Sandbox</title>
    <meta charset="UTF-8" />
  </head>

  <body>
    <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.2.1.min.js"></script>
  </body>
</html>

我们非常欢迎任何帮助。我想要一个数组,它将数据分组到各自的组中,并从第一个记录中获得一些信息,例如名称、父级 sku 等,然后子部分具有项目的所有信息,但显然在各自的组中。希望这是有道理的!再次感谢!

最佳答案

您可以使用 reduceproduct-sku 分组

var items = [{
    product_type: "configurable",
    options: [{
      label: "Size",
      value: "7.5",
      option_id: 190,
      option_value: 106
    }],
    qty: 3,
    item_id: "300",
    product_id: "88105",
    product_name: "MENS SHOE TUDOR BLACK",
    product_sku: "M1S-TUD02-AVEL-79-7.5",
  },
  {
    product_type: "configurable",
    options: [{
      label: "Size",
      value: "11",
      option_id: 190,
      option_value: 99
    }],
    qty: 3,
    item_id: "298",
    product_id: "88105",
    product_name: "MENS SHOE TUDOR BLACK",
    product_sku: "M1S-TUD02-AVEL-79-11",
  },
  {
    product_type: "configurable",
    options: [{
      label: "Size",
      value: "M",
      option_id: 190,
      option_value: 66
    }],
    qty: 1,
    item_id: "111",
    product_id: "99945",
    product_name: "WOMENS SWEATER",
    product_sku: "W1R-613K-A10400-96-M",
  },
  {
    product_type: "configurable",
    options: [{
      label: "Size",
      value: "L",
      option_id: 190,
      option_value: 12
    }],
    qty: 20,
    item_id: "278",
    product_id: "99945",
    product_name: "WOMENS SWEATER",
    product_sku: "W1R-613K-A10400-96-L",
  },
];

var groupedItems = items.reduce((acc, item) => {
  if (item.product_type === "configurable") {
    var sku = item.product_sku;
    var parentSku = sku.replace(sku.substring(sku.lastIndexOf("-")), "");
		
    if (sku.indexOf(parentSku) >= 0) {
      if (!!acc[parentSku]) {
        let children = acc[parentSku].children;
        acc[parentSku].children = [...children, { ...item
        }];
      } else {
        acc[parentSku] = {
          product_sku: parentSku,
          product_name: item.product_name,
          product_type: item.product_type,
          children: [item]
        };
      }
    }
  }

  return acc;
}, []);

console.log(groupedItems);

关于javascript - 如何在每个循环中对 Json 对象进行分组,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54991719/

相关文章:

javascript - 如何将backgrid与backbone布局管理器集成

javascript - 如何根据 Jquery 中的屏幕大小移动绝对位置元素

python - 将数组 (k,) 或 (k, n) 乘以一维数组 (k,)

javascript - 清除页面缓存

javascript - JS : "this" in function context in strict mode, MDN 规范与 chrome 67 实现不匹配

javascript - 如何在 JQuery 中获取选定的列表属性

javascript - 获取未解析的元素内容

javascript - 使用 Javascript 将 CSS 标记输出到字符串

javascript - 对于较大的数组 - 返回 NaN 而不是数字

来自两个不同大小数组的 Ruby 数组?