如何用JavaScript拆分对象数组的invocations子数组并复制父对象

现有一个对象数组，数组中的每个对象包含invocations字段（该字段是一个对象数组）。需要将每个主对象按照其invocations数组的元素数量拆分为多个副本，每个副本的invocations只保留原数组中的一个元素。

输入示例 #

const input = [
    {
        "name": "Test Data",
        "invocations": [
            { "invocationId": "123" },
            { "invocationId": "125" },
        ]
    },
]

预期输出 #

const output = [
    {
        "name": "Test Data",
        "invocations": [
            { "invocationId": "123" },
        ]
    },
    {
        "name": "Test Data",
        "invocations": [
            { "invocationId": "125" },
        ]
    }
]

解决方案 #

可以利用数组的flatMap和map方法组合实现需求：

const input = [
    {
        "name": "Test Data",
        "invocations": [
            { "invocationId": "123" },
            { "invocationId": "125" }
        ]
    }
];

const output = input.flatMap(parentObj => 
    parentObj.invocations.map(invItem => ({
        // 复制父对象的所有属性
        ...parentObj,
        // 将invocations替换为仅包含当前元素的数组
        invocations: [invItem]
    }))
);

console.log(output);

代码说明

• flatMap：先对输入数组中的每个父对象执行映射操作，再将返回的多个数组合并成一个结果数组，完美适配“一个父对象拆分成多个子对象”的场景。
• 内部的map：遍历父对象的invocations数组，为每个元素生成一个新的父对象副本，用扩展运算符...parentObj保留原对象的其他属性，同时替换invocations字段为仅包含当前元素的数组。

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