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

Question

I got the Array like the below:

[
  {
    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,
      },
    ],
  },
];

But I want to make it like:

[
  {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}....
]

So what I can do to reach the above result. Thanks a lot.

Answer 1

You can use .flatMap() with an inner .map() and destructuring assignment to convert your nested module arrays into individual objects like so:

 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() does have limited browser support, so you can use .reduce() if you need something more browser compatible:

 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 */