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

本文档旨在提供一种解决方案，用于合并数组中具有相同键值的对象。通过 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 数组的合并结果。

聚好用AI

可免费AI绘图、AI音乐、AI视频创作，聚集全球顶级AI，一站式创意平台

下载

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