合并数组中具有相同键值的对象

本文档旨在提供一种解决方案,用于合并数组中具有相同键值的对象。通过 JavaScript 代码示例,我们将演示如何根据 categoryId 对对象进行分组,并将具有相同 categoryId 的对象的 addons 数组合并成一个。最终结果将是一个包含唯一 categoryId 和合并后的 addons 数组的新对象数组。

在处理包含重复键值的对象数组时,经常需要将具有相同键值的对象合并为一个对象,并将它们的值组合起来。以下介绍一种方法,用于根据 categoryId 合并对象,并将具有相同 categoryId 的对象的 addons 数组合并。

数据结构

假设我们有以下数据结构:

const items = [
  {
    "addons

": [ { "addonId": "Addon_5035fac357f446fb8b4fcff45d2e36e5", "addonIdentifier": "Gherkin", "addonQuantity": 1, "subTotal": 0.99, "addonType": "EXTRAS" } ], "categoryId": "Addon_Cate_1a7bacd1a07b40ceb7d5d3a2229fb303", "categoryIdentifier": "Extra 1" }, { "addons": [ { "addonId": "Addon_700a1458fae54ba9b3e148da709eea4a", "addonIdentifier": "Hash Brown", "addonQuantity": 1, "subTotal": 0.99, "addonType": "EXTRAS" } ], "categoryId": "Addon_Cate_1a7bacd1a07b40ceb7d5d3a2229fb303", "categoryIdentifier": "Extra 1" }, { "addons": [ { "addonId": "Addon_f4408295adb14723aa22a3a7e645a7a7", "addonIdentifier": "Cheese", "addonQuantity": 1, "subTotal": 0.99, "addonType": "EXTRAS" } ], "categoryId": "Addon_Cate_1a7bacd1a07b40ceb7d5d3a2229fb303", "categoryIdentifier": "Extra 1" } ];

实现方法

我们可以使用 reduce 方法来遍历数组,并创建一个新的对象,其中键是 categoryId,值是具有相同 categoryId 的对象的 addons 数组的合并结果。

const mergedItems = items.reduce((acc, item) => {
  const { categoryId } = item;

  if (!acc[categoryId]) {
    acc[categoryId] = {
      addons: [],
      categoryId: item.categoryId,
      categoryIdentifier: item.categoryIdentifier
    };
  }

  acc[categoryId].addons = acc[categoryId].addons.concat(item.addons);
  return acc;
}, {});

const result = Object.values(mergedItems);

console.log(result);

代码解释

  1. items.reduce((acc, item) => { ... }, {}): 使用 reduce 方法遍历 items 数组。acc 是累加器,初始值为空对象 {}。
  2. const { categoryId } = item;: 从当前 item 对象中提取 categoryId 属性。
  3. if (!acc[categoryId]) { ... }: 检查累加器 acc 中是否已经存在以 categoryId 为键的属性。如果不存在,则创建一个新的对象,并初始化 addons 数组,以及复制 categoryId 和 categoryIdentifier。
  4. acc[categoryId].addons = acc[categoryId].addons.concat(item.addons);: 将当前 item 对象的 addons 数组连接到累加器 acc 中对应 categoryId 的对象的 addons 数组。
  5. return acc;: 返回更新后的累加器 acc。
  6. Object.values(mergedItems): 将 mergedItems 对象的值转换为数组,得到最终结果。

输出结果

上述代码将输出以下结果:

[
  {
    "addons": [
      {
        "addonId": "Addon_5035fac357f446fb8b4fcff45d2e36e5",
        "addonIdentifier": "Gherkin",
        "addonQuantity": 1,
        "subTotal": 0.99,
        "addonType": "EXTRAS"
      },
      {
        "addonId": "Addon_700a1458fae54ba9b3e148da709eea4a",
        "addonIdentifier": "Hash Brown",
        "addonQuantity": 1,
        "subTotal": 0.99,
        "addonType": "EXTRAS"
      },
      {
        "addonId": "Addon_f4408295adb14723aa22a3a7e645a7a7",
        "addonIdentifier": "Cheese",
        "addonQuantity": 1,
        "subTotal": 0.99,
        "addonType": "EXTRAS"
      }
    ],
    "categoryId": "Addon_Cate_1a7bacd1a07b40ceb7d5d3a2229fb303",
    "categoryIdentifier": "Extra 1"
  }
]

总结

通过使用 reduce 方法,我们可以有效地合并数组中具有相同键值的对象,并将它们的值组合起来。这种方法可以应用于各种数据结构和场景,以满足不同的需求。在实际应用中,可以根据具体情况调整代码,例如,可以根据不同的键值进行合并,或者可以对合并后的值进行进一步处理。