如何根据arr2的id属性过滤arr1？代码逻辑错误求修正

你遇到的问题是逻辑判断的方向搞反啦！咱们先理清楚需求：要从arr1里筛选出那些id不在arr2里出现过的元素，对吧？

错误原因分析 #

你原来用的arr2.some((value) => value.id !== item.id)，some方法的逻辑是“只要数组里有一个元素满足条件就返回true”。拿arr1里的id=1的元素举例：arr2里有id=2的元素，value.id !== item.id成立，所以some返回true，filter就把这个元素留下来了——这完全和咱们要的结果相反啦！

修正后的代码 #

咱们要改成判断“arr2里没有任何一个元素的id和当前item的id相同”，有两种常用写法：

写法一：用!some取反

const arr1 = [ {id: 1, name: 'first'}, {id: 2, name: 'second'}, {id: 3, name: 'third'} ];
const arr2 = [ {id: 1, name: 'first', color: 'blue'}, {id: 2, name: 'second', color: 'red'} ];

const result = arr1.filter((item) => {
  // 判断arr2中不存在和当前item.id相同的元素
  return !arr2.some((value) => value.id === item.id);
});

console.log(result); // 输出：[{id: 3, name: 'third'}]

写法二：用every直接判断

every的逻辑是“数组里所有元素都满足条件才返回true”，所以可以直接写：

const result = arr1.filter((item) => {
  return arr2.every((value) => value.id !== item.id);
});

逻辑验证 #

• 对于arr1里id=1的元素：arr2里存在id=1的元素，some返回true，取反后是false，filter会排除它；
• 对于arr1里id=3的元素：arr2里没有匹配的id，some返回false，取反后是true，filter会保留它；
  这样就刚好得到咱们想要的结果啦～

内容的提问来源于stack exchange，提问作者Kevin Lee