如何处理二维数组转换为一维数组在JS中

Question

我得到了如下所示的数组：

[
{
companyId: 'TW0826',
modules: [
{
name: 'Module A',
condition: true,
},
{
name: 'Module B',
condition: false,
},
{
name: 'Module C',
condition: true,
},
],
},
{
companyId: 'TXT777',
modules: [
{
name: 'Module B',
condition: true,
},
{
name: 'Module C',
condition: false,
},
{
name: 'Module D',
condition: false,
},
],
},
];

但我想让它像：

[
{companyId:'TW0826', name:'Module A', condition:ture},
{companyId:'TW0826',name:'Module B', condition:false},
{companyId:'TXT777',name:'Module B',condition:ture},
{companyId:'TXT777',name:'Module C',condition:false}....
]

那么我能做些什么来达到上述结果。多谢。

Answer 1

您可以将.flatMap()与内部.map()和解构赋值一起使用，将嵌套模块数组转换为单个对象，如下所示：

const data = [{companyId: 'TW0826', modules: [ { name: 'Module A', condition: true, }, { name: 'Module B', condition: false, }, { name: 'Module C', condition: true, }, ], }, { companyId: 'TXT777', modules: [ { name: 'Module B', condition: true, }, { name: 'Module C', condition: false, }, { name: 'Module D', condition: false, }, ], }, ];
const res = data.flatMap(
({companyId, modules}) => 
modules.map(({name, condition}) => ({companyId, name, condition}))
);
console.log(res);

.as-console-wrapper { max-height: 100% !important;} /* ignore */

.flatMap()确实有有限的浏览器支持，因此如果您需要更多与浏览器兼容的内容，可以使用.reduce()：

const data = [{companyId: 'TW0826', modules: [ { name: 'Module A', condition: true, }, { name: 'Module B', condition: false, }, { name: 'Module C', condition: true, }, ], }, { companyId: 'TXT777', modules: [ { name: 'Module B', condition: true, }, { name: 'Module C', condition: false, }, { name: 'Module D', condition: false, }, ], }, ];
const res = data.reduce(
(acc, {companyId, modules}) => 
[...acc, ...modules.map(({name, condition}) => ({companyId, name, condition}))], []
);
console.log(res);

.as-console-wrapper { max-height: 100% !important;} /* ignore */