Question

关于执行以下操作的最佳方法，我有几个问题：

调用两个不同的API：

axios.get(contents);
axios.get(favorites);

响应将如下所示：

contents: [
   {
       id: 1,
       value: someValue
   },
   {
       id: 2,
       value: someValue
   }
];

favorites: [
    {
        id: 1,
        contentId: 2    
    }
];

当isFavorite: true与contentId匹配时，最好的方法是遍历每个收藏夹并将元素添加到诸如id的内容数组中。它应该如下所示：

    contents: [
        {
            id: 1,
            value: someValue
        {,
        {
            id: 2,
            value: someValue
            isFavorite: true
        {
    ];

执行此操作的最佳位置是什么，是否有任何ES6语法可以轻松执行此操作？我目前有两个动作是分开的，一个是获取内容，另一个是收藏夹，我可以将它们合并或在化简器上合并。

有什么建议吗？

Answer 1

const newContents = contents.map((content) => {
   const foundFavorite = favorites.find((favorite) => favorite.contentId === content.id)
   if (foundFavorite) {
      return {
         ...content,
         isFavorite: true,
      }
   }
   return content
});

Answer 2

首先，您需要从API调用中获得承诺，当它们都完成后，您便可以合并结果。

const contentsApi = () => Promise.resolve([
   {
       id: 1,
       value: 'foo'
   },
   {
       id: 2,
       value: 'bar'
   }
])

const favouritesApi = () => Promise.resolve([
    {
        id: 1,
        contentId: 2    
    }
])

let contents;
let favourites;

const contentsApiCall = contentsApi().then(res => {
    contents = res;
})

const favouritesApiCall = favouritesApi().then(res => {
  favourites = res;
})



Promise.all([contentsApiCall, favouritesApiCall]).then(() => {
    const merged = contents.map(content => {
    if(favourites.some(favourite => favourite.contentId === content.id)){
        return {
        ...content,
        isFavourite: true
      }
    } else {
        return content;
    }
  })
  console.log(merged)
  // do whatever you need to do with your result, either return it if you want to chain promises, or set it in a variable, etc.
})

Answer 3

您可以使用Set从contentId收集所有favorites值，然后遍历contents数组。与在数组上使用some相比，这具有更好的时间复杂性，因为在.has()上调用Set是 O（1）：

let contents = [{
    id: 1,
    value: 'someValue1'
  },
  {
    id: 2,
    value: 'someValue2'
  },
  {
    id: 3,
    value: 'someValue'
  }
];

let favorites = [{
    id: 1,
    contentId: 2
  },
  {
    id: 2,
    contentId: 3
  }
];

let favoriteContents = new Set(favorites.map(f => f.contentId));
contents.forEach(c => {
  if (favoriteContents.has(c.id)) c.isFavorite = true;
});
console.log(contents);

将一个数组的项目属性合并到另一个数组的项目中

3 个答案: