资源

Question

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

我有一个包含object的数组，在该对象中，它包含每个对象的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状态。

Answer 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);

Answer 2

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

＆＃13;

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)))

＆＃13;

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

然后，您只需使用您的ID列表在Map上执行提取。

Answer 3

使用reduce功能

＆＃13;

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);

＆＃13;

资源

Answer 4

您可以使用array#find和array#map。

＆＃13;

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'} ],
    ids = [1,4],
    result = ids.map(id => data.find(o => o.id === id));
console.log(result);

＆＃13;

显示数组中与数组值匹配的所有对象

4 个答案:

资源