Question

我需要找到每个专辑的第一张照片。这张照片列出在一个数组中，该数组在每张照片上都包含一个albumId，如下所示：

[ { 编号：1 albumId：1 }， { 编号：2 albumId：1 }， { id：3， albumId：2 }， { 编号：4 albumId：2 } ]

因此，每个对象都是一张照片，并已连接到相册。我想做的是遍历此数组，并创建一个新数组，假设原始数组按顺序排列，那么该数组仅包括每个相册中的第一张照片（因此，第一次出现新的albumId时，您可以假定这是第一个相册中的照片）。

当前，这是我拥有的代码：

let lastAlbumId = null;
const newAlbumArray = [];

albums.forEach(photo => {
  if (lastAlbumId === null) {
    lastAlbumId = photo.albumId;
    newAlbumArray.push(photo);
  } else if (lastAlbumId !== photo.albumId) {
    lastAlbumId = photo.albumId;
    newAlbumArray.push(photo);
  }
});

return newAlbumArray;

此代码有效，但是我觉得必须有一种更干净的方法来执行此操作，例如filter（）或find（），有什么建议吗？

Answer 1

您可以将Array.filter()与Set结合使用来跟踪已添加的相册：

const photos = [{ id: 1, albumId: 1, }, { id: 2, albumId: 1, }, { id: 3, albumId: 2, }, { id: 4, albumId: 2, } ]

const albums = new Set();
const result = photos.filter(o => !albums.has(o.albumId) && albums.add(o.albumId))

console.log(result)

另一种选择是使用albumId作为键，将数组reduce Map。仅当相册的ID不存在时，才能将照片添加到地图。完成后，我们通过spreading地图的values iterator将地图转换为数组：

const photos = [{ id: 1, albumId: 1, }, { id: 2, albumId: 1, }, { id: 3, albumId: 2, }, { id: 4, albumId: 2, } ]

const result = [...photos.reduce((m, o) => m.has(o.albumId) ? m :  m.set(o.albumId, o), new Map).values()]

console.log(result)

Answer 2

使用reduce。

const albums = [ { id: 1, albumId: 1, }, { id: 2, albumId: 1, }, { id: 3, albumId: 2, }, { id: 4, albumId: 2, } ];

const output = Object.values(albums.reduce((accu, {id, albumId}) => {
    if(!accu[albumId]) accu[albumId] = {id, albumId};
    return accu;
}, {}));

console.log(output);

在具有AlbumIds的照片阵列中查找每个相册中的第一张照片

2 个答案: