如何在JavaScript中通过vendor_id合并分组用户与企业数组

我有一个company_list数组，还有一个按vendor_id分组好的user_list对象，需要给company_list里的每个企业对象添加对应的user_list字段，生成目标group_list数组。已经完成user_list的分组逻辑，但卡在合并步骤，求实现方法。

相关数据示例 #

company_list #

const company_list =
[
    {
        "vendor_id": "62d884697df5ad65745001a9",
        "vendor_name": "vender_name_1"
    },
    {
        "vendor_id": "add8846dad5ad657450s01a",
        "vendor_name": "vender_name_2"
    },
    {
        "vendor_id": "34d8846dad5add57450sss3",
        "vendor_name": "vender_name_3"
    }
]

分组后的user_list #

const user_list =
{
    "62d884697df5ad65745001a9": [
        {
            "user_id": "0e9a3faf-4dcc-4681-a153-2f6c7acd161d",
            "user_name": "user_1"
        },
        {
            "user_id": "f39769cb-e567-4da9-8e2c-9e39daaba9ed",
            "user_name": "user_2"
        }
    ],
    "add8846dad5ad657450s01a": [
        {
            "user_id": "de9adfaf-4dcc-d681-ad53-2f6cdacd161d",
            "user_name": "user_3"
        },
        {
            "user_id": "g397g9cb-e5g7-4dag-8e2cgge39daaba9",
            "user_name": "user_4"
        }
    ],
    "34d8846dad5add57450sss3": [
        {
            "user_id": "deaadfaf-4dac-d6a1-ad5a-2f6adacd161a",
            "user_name": "user_5"
        },
        {
            "user_id": "g397b9cb-e5g7-4dab-8b2cgge39daaba9",
            "user_name": "user_6"
        }
    ]
}

目标group_list #

const group_list =
[
    {
        "vendor_id": "62d884697df5ad65745001a9",
        "vendor_name": "vender_name_1",
        "user_list" : [
            {
                "user_id": "0e9a3faf-4dcc-4681-a153-2f6c7acd161d",
                "user_name": "user_1"
            },
            {
                "user_id": "f39769cb-e567-4da9-8e2c-9e39daaba9ed",
                "user_name": "user_2"
            }
        ]
    },
    {
        "vendor_id": "add8846dad5ad657450s01a",
        "vendor_name": "vender_name_2",
        "user_list" : [
            {
                "user_id": "de9adfaf-4dcc-d681-ad53-2f6cdacd161d",
                "user_name": "user_3"
            },
            {
                "user_id": "g397g9cb-e5g7-4dag-8e2cgge39daaba9",
                "user_name": "user_4"
            }
        ]
    },
    {
        "vendor_id": "34d8846dad5add57450sss3",
        "vendor_name": "vender_name_3",
        "user_list" : [
            {
                "user_id": "deaadfaf-4dac-d6a1-ad5a-2f6adacd161a",
                "user_name": "user_5"
            },
            {
                "user_id": "g397b9cb-e5g7-4dab-8b2cgge39daaba9",
                "user_name": "user_6"
            }
        ]
    }
]

已实现的分组逻辑 #

const groupByCompany = async (array, key) => {
    const response = await array.reduce((result, currentValue) => {
      (result[currentValue[key]] = result[currentValue[key]] || []).push(
        currentValue
      );
      return result;
    }, {});
    return response;
};

可以通过数组map方法遍历company_list，结合对象扩展运算符完成合并，核心逻辑是用每个企业的vendor_id作为键，从分组好的user_list中取出对应的用户列表，添加到企业对象中。

基础实现代码 #

const group_list = company_list.map(company => ({
  // 复制原企业的所有属性
  ...company,
  // 通过vendor_id匹配用户列表，默认空数组避免undefined
  user_list: user_list[company.vendor_id] || []
}));

异步场景适配 #

如果company_list或user_list是异步获取的，只需在异步函数中执行上述逻辑即可：

const generateGroupList = async () => {
  // 替换为实际的异步获取逻辑
  const company_list = await fetch('/api/companies');
  const rawUserList = await fetch('/api/users');
  const user_list = await groupByCompany(rawUserList, 'vendor_id');
  
  const group_list = company_list.map(company => ({
    ...company,
    user_list: user_list[company.vendor_id] || []
  }));
  
  return group_list;
};

逻辑说明 #

• map方法会遍历company_list的每个元素，返回新对象，不会修改原数组
• 扩展运算符...company保留原企业对象的所有属性
• user_list[company.vendor_id] || []确保即使某个企业没有对应的用户数据，也会添加一个空数组，避免出现undefined字段

内容的提问来源于stack exchange，提问作者user18703133