【问题标题】：Displaying all objects in an array that match array values [duplicate]显示数组中与数组值匹配的所有对象[重复]
【发布时间】：2018-02-01 00:58:36
【问题描述】：

我是网络开发的新手。我试图找出实现这一点的方法。这是我的情况：

我有一个包含对象的数组，在该对象中，它包含每个对象的 id。这是一个例子，

[ {id: 1, content: 'asdfadf', contentB: 'adsfasdf'}, {id: 2, content: 'asdfadf', contentB: 'adsfasdf'}, {id: 3, content: 'asdfadf', contentB: 'adsfasdf'}, {id: 4, content: 'asdfadf', contentB: 'adsfasdf'} ]

我有一个数组，其中包含我想要从上述数组中获取的对象的 id。例如：

[1,4]

我想根据数组值显示对象。我应该使用什么 Javascript 函数？

提前谢谢你！

顺便说一句，我的项目现在正在使用 Vue.js，而我想要显示的对象实际上是 Vuex 状态。

【问题讨论】：

标签： javascript vue.js

【解决方案1】：

使用.filter

var idsToFind = [1,4];
var data = [ {id: 1, content: 'asdfadf', contentB: 'adsfasdf'}, {id: 2, content: 'asdfadf', contentB: 'adsfasdf'}, {id: 3, content: 'asdfadf', contentB: 'adsfasdf'}, {id: 4, content: 'asdfadf', contentB: 'adsfasdf'} ];

var result = data.filter( item => idsToFind.includes(item.id) );

console.log(result);

【讨论】：

或idsToFind.includes(item.id)
@MikeMcCaughan 我愿意，但发现它比写这个答案需要更长的时间。如果 SO 改进搜索，我将标记比我已经做的更多的重复！
@JeremyThille 谢谢，我真的以为我写的。很好发现。

【解决方案2】：

创建更好的数据结构，适合通过ID查找。

var data = [ {id: 1, content: 'asdfadf', contentB: 'adsfasdf'}, {id: 2, content: 'asdfadf', contentB: 'adsfasdf'}, {id: 3, content: 'asdfadf', contentB: 'adsfasdf'}, {id: 4, content: 'asdfadf', contentB: 'adsfasdf'} ]
var map = new Map(data.map(o => [o.id, o]))

var ids = [1,4];
ids.forEach(id => console.log(map.get(id)))

此解决方案获取您的数据并将其转换为Map 结构，其中id 是映射到原始对象的键。

然后，您可以使用您的 ID 列表简单地对 Map 执行提取。

【讨论】：

我不会反对它，因为它有效，但它有点矫枉过正。 .filter 要简单得多。
@JeremyThille：只有当这是一次时才会发生查找，我对此表示怀疑。当需要通过数组中对象内的唯一 ID 多次查找数组项时，它应该被视为处理此问题的首选方法。

【解决方案3】：

使用reduce函数

var targetIdx = [1, 4];
var data = [{
  id: 1,
  content: 'asdfadf',
  contentB: 'adsfasdf'
}, {
  id: 2,
  content: 'asdfadf',
  contentB: 'adsfasdf'
}, {
  id: 3,
  content: 'asdfadf',
  contentB: 'adsfasdf'
}, {
  id: 4,
  content: 'asdfadf',
  contentB: 'adsfasdf'
}];

var result = data.reduce((acc, curr) => 
  targetIdx.indexOf(curr.id) > -1 ? [...acc, curr] : acc
, []);

console.log(result);

资源

【讨论】：

与@SkinnyPete 的回答相同：我不会反对它，因为它有效，但它有点矫枉过正。 .filter 要简单得多。
@JeremyThille 我完全同意你的看法，但是，重要的是要分享另一种方式，这充满了我们社区的知识，显然是 OP。
这是一个公平的观点。