如何将对象数组按组分组到新的数组中？

Question

我有以下数组

    const arr = [
      {
       Images: [{ id: 1 }, { id: 2 }, { id: 3 }],
       MediaCategoryName: "Exterior",
       id: 51
      },

       {
       Images: [{ id: 7 }, { id: 8 }, { id: 9 }],
       MediaCategoryName: "Construction",
       id: 687
      },

      {
      Images: [{ id: 10 }, { id: 11 }, { id: 21 }],
      MediaCategoryName: "home",
      id: 755
     }
    ];

我该如何从中创建新的数组并仅保留 Images？

我需要像这样的东西

newArr = [ { id: 1 }, { id: 2 }, { id: 3 }, { id: 7 }, { id: 8 }
         , { id: 9 }, { id: 10 }, { id: 11 }, { id: 21 }
         ]

有人能帮我实现这个吗？

谢谢:)

- someone

Answer 1

使用Array.prototype.flatMap()，
就像返回图像并执行扁平化的映射一样。

const arr = 
  [ { Images: [{ id:  1}, {id:  2}, {id:  3 }] , MediaCategoryName: 'Exterior',     id:  51 } 
  , { Images: [{ id:  7}, {id:  8}, {id:  9 }] , MediaCategoryName: 'Construction', id: 687 } 
  , { Images: [{ id: 10}, {id: 11}, {id: 21 }] , MediaCategoryName: 'home',         id: 755 } 
  ];


const res = arr.flatMap(({Images}) => Images)

console.log(JSON.stringify(res))

.as-console-wrapper {max-height: 100% !important;top: 0;}
.as-console-row::after {display: none !important;}

- cmgchess

Answer 2

你可以尝试这段代码，它将从arr中获取每个元素并进行处理。

out = []
arr.forEach((el)=>{
    x.push(...el.Images)
})

- Arkadip Bhattacharya