这两个数组怎么取交集呢？

Question

假设第一个数组是['123','234','567']，
第二个数组是[{id:'111',name:'小明'},{id:'123',name:'菜虚鲲'},{id:'234',name:'小张'}]

我想得到两个数组交集并且是以第二种数组的展示方式，

比如得到 [{id:'123',name:'菜虚鲲'},{id:'234',name:'小张'}]这样的结果

Answer 1

.filter() 一下就好了呀？

var arr1 = ['123','234','567']
var arr2 = [{id:'111',name:'小明'},{id:'123',name:'菜虚鲲'},{id:'234',name:'小张'}]
var resultArr = arr2.filter(item => arr.includes(item.id))
// (2) [{…}, {…}]
// 0: {id: '123', name: '菜虚鲲'}
// 1: {id: '234', name: '小张'}
// length: 2

本文参与了SegmentFault 思否面试闯关挑战赛，欢迎正在阅读的你也加入。

Answer 2

  let list = ['123', '234', '567']
  let arr = [{ id: '111', name: '小明' }, { id: '123', name: '菜虚鲲' }, { id: '234', name: '小张' }]
  let result = []
  for (let item of arr ) {
    if (list.includes(item.id)) result.push(item)
  }
  console.log(result);

本文参与了SegmentFault 思否面试闯关挑战赛，欢迎正在阅读的你也加入。

Answer 3

下面的几种方法可以实现你的需求。

1. 使用Array.some()和Array.filter()方法
   array.some()方法可以检查数组中是否有元素满足给定的条件，返回true或false。array.filter()方法可以根据给定的条件过滤出数组中的元素，返回一个新的数组。

//定义两个数组
var arr1 = ['123','234','567'];
var arr2 = [{id:'111',name:'小明'},{id:'123',name:'菜虚鲲'},{id:'234',name:'小张'}];

//使用array.some()和array.filter()方法得到交集，并保留对象格式
var result = arr2.filter(function(item){
  return arr1.some(function(id){
    return id === item.id;
  });
});

//打印结果
console.log(result); //输出[{id:'123',name:'菜虚鲲'},{id:'234',name:'小张'}]

2. 使用Set对象、Array.from()和Array.find()方法
   Set对象可以存储唯一值，Array.from()方法可以从类似数组或可迭代对象创建一个新的数组。然后使用array.find()方法，这是ECMAScript 6中的一个新方法，它可以返回数组中满足给定条件的第一个元素。

//定义两个数组
var arr1 = ['123','234','567'];
var arr2 = [{id:'111',name:'小明'},{id:'123',name:'菜虚鲲'},{id:'234',name:'小张'}];

//创建一个Set对象存储arr1中的值
var set1 = new Set(arr1);

//使用Array.from()和array.find()方法得到交集，并保留对象格式
var result = Array.from(set1).map(id => arr2.find(item => item.id === id));

//打印结果
console.log(result); //输出[{id:'123',name:'菜虚鲲'},{id:'234',name:'小张'}]

3. 使用reduce()和concat()方法
   reduce()方法对数组中的每个元素执行一个函数，并返回一个累计结果，concat()方法用于合并两个或多个数组。然后使用array.map()和array.indexOf()方法，array.map()方法对数组中的每个元素执行一个函数，并返回一个新的数组，array.indexOf()方法返回数组中指定元素的第一个索引。

//定义两个数组
var arr1 = ['123','234','567'];
var arr2 = [{id:'111',name:'小明'},{id:'123',name:'菜虚鲲'},{id:'234',name:'小张'}];

//使用reduce()和concat()方法得到交集
var intersection = [arr1, arr2.map(item => item.id)].reduce((a, b) => a.filter(c => b.includes(c)));

//使用array.map()和array.indexOf()方法保留对象格式
var result = intersection.map(id => arr2[arr2.map(item => item.id).indexOf(id)]);

//打印结果
console.log(result); //输出[{id:'123',name:'菜虚鲲'},{id:'234',name:'小张'}]

Answer 4

基本的数组过滤：

var arr1 = ['123', '234', '567']
var arr2 = [{id:'111',name:'小明'}, {id:'123',name:'菜虚鲲'}, {id:'234',name:'小张'}]

var res = arr2.filter(item => arr1.includes(item.id))

本文参与了SegmentFault 思否面试闯关挑战赛，欢迎正在阅读的你也加入。

Answer 5

可以使用filter和some方法来实现这个功能。filter方法可以过滤出第一个数组中与第二个数组中id相同的元素，some方法可以判断第二个数组中是否存在该元素。代码如下：

const arr1 = ['123','234','567'];
const arr2 = [{id:'111',name:'小明'},{id:'123',name:'菜虚鲲'},{id:'234',name:'小张'}];

const result = arr2.filter(item2 => arr1.some(item1 => item1 === item2.id));

console.log(result);

输出结果为：[{id:'123',name:'菜虚鲲'},{id:'234',name:'小张'}]