数组和数组对象的差集

数组和数组对象的差集

上几篇文章写完了并集、交集、去重，还剩一个差集，今天搞一下差集，有需要的老铁可以瞅瞅，记得点赞评论加关注，嘎嘎，我会继续努力，经常更新。话不多说，上代码！

以某一集合做为全集，由除去某一集合的元素，剩余部分元素组成的集合，称为这个集合差集

1、使用filter和indexOf获取数组的差集

indexOf()方法用于返回某个指定的字符串的值在字符串中首次出现的位置，如果匹配到，则最小返回值为0，如果没有找到匹配的字符串则返回 -1。我们在这也可以理解为返回值只要小于0，就说明该字符串中不包含其指定的字符串，示例如下：

const arr1 = [1,2,3,4,5,6,7,8,9]
const arr2 = [1,2,3,4]
const arr3 = arr1.filter(x => arr2.indexOf(x) < 0)
console.log(arr3) // [5,6,7,8,9] 解析如下：
// arr1使用filter开始循环，每一项为x，并将arr1中满足条件arr2.indexOf(x) < 0的x元素push到arr3中
// arr2使用indexOf开始搜索arr1中传过来的x
// 当arr2中不包含x时,且arr2.indexOf(x) < 0为true，此时arr1的filter捕获到true时，便会将x元素push到arr3中

// 数组对象:求arr1的差集(数组对象借助map方法，将id单独提出来) 
const arr1 = [{id:1, name: '张三'},{id:2,name:'李四'},{id:3,name:'王五'}] 
const arr2 = [{id:1, name: '张三'},{id:2,name:'李四'},{id:4,name:'孟六'}] 
const arr3 = arr2.map(item=>item.id) 
const arr4 = arr1.filter(x => arr3.indexOf(x.id) < 0) 
console.log(arr4) 
// [{id: 3, name: '王五'}] 解析如下： 
// arr2通过map方法，将每一项的id存储到arr3中 
// arr1使用filter开始循环，每一项为x，并将arr1中满足条件arr3.indexOf(x.id) > -1的x元素push到arr4中 
// arr3使用indexOf开始检索arr1中传过来的x.id 
// 当arr3中不包含x.id时，返回true,此时arr1的filter捕获到true时，便会将x元素push到arr4中，包含则返回false，继续向下检索

2、使用filter和findIndex获取数组的差集

findIndex和indexOf的用法相似，返回第一个符合条件的数组成员的位置，如果匹配到，则最小返回值为0，如果没有找到匹配的则返回 -1。我们在这也可以理解为返回值只要小于0，就说明该数组中不包含其指定的内容，示例如下：

// findIndex的使用示例：
const a = [1,2,3,4,5]
const num1 = a.findIndex(value => {
  return value == 1;
})
const num2 = a.findIndex(value => {
  return value == 9;
})
console.log(num1) // 0 1在数组a中的位置是0
console.log(num2) // -1 9在数组a中不存在，所以返回值是-1

// filter和findIndex求arr1的差集
const arr1 = [1,2,3,4,5]
const arr2 = [3,4,5,6,7]
const arr3 = arr1.filter(x => arr2.findIndex(y => { return x == y }) < 0)
console.log(arr3) // [1,2] 解析如下： 
// arr1使用filter开始循环，每一项为x，并将arr1中满足条件arr2.findIndex(y => { return x == y }) < 0的x元素push到arr3中 
// arr2使用findIndex开始搜索arr1中传过来的x 
// 当arr2中不包含x时，返回-1,且<0为true，此时arr1的filter捕获到true时，便会将x元素push到arr3中

// 数组对象:求arr1的差集
const arr1 = [{id:1, name: '张三'},{id:2,name:'李四'},{id:3,name:'王五'}]
const arr2 = [{id:1, name: '张三'},{id:2,name:'李四'},{id:4,name:'孟六'}]
const arr3 = arr1.filter(x => arr2.findIndex(y => { return x.id == y.id }) < 0)
console.log(arr3) // [{id: 3, name: '王五'}]

3、使用filter和findLastIndex获取数组的差集

findLastIndex和findIndex的用法相似，只是从最后开始循环，返回第一个符合条件的数组成员的位置，如果匹配到，则最小返回值为0，如果没有找到匹配的则返回 -1。我们在这也可以理解为返回值只要大于-1，就说明该数组中包含其指定的内容，示例如下：

// findLastIndex的使用示例：
const a = [1,2,3,4,5]
const num1 = a.findLastIndex(value => {
  return value == 1;
})
const num2 = a.findLastIndex(value => {
  return value == 9;
})
console.log(num1) // 0 1在数组a中的位置是0
console.log(num2) // -1 9在数组a中不存在，所以返回值是-1

// filter和findLastIndex求arr1的差集
const arr1 = [1,2,3,4,5]
const arr2 = [3,4,5,6,7]
const arr3 = arr1.filter(x => arr2.findLastIndex(y => { return x == y })  < 0)
console.log(arr3) // [1,2] 解析如下： 
// arr1使用filter开始循环，每一项为x，并将arr1中满足条件arr2.findLastIndex(y => { return x == y }) < 0的x元素push到arr3中 
// arr2使用findLastIndex开始搜索arr1中传过来的x 
// 当arr2中不包含x时，返回-1,且<0为true，此时arr1的filter捕获到true时，便会将x元素push到arr3中

// 数组对象:求arr1和arr2中id相同的集合
const arr1 = [{id:1, name: '张三'},{id:2,name:'李四'},{id:3,name:'王五'}]
const arr2 = [{id:1, name: '张三'},{id:2,name:'李四'},{id:4,name:'孟六'}]
const arr3 = arr1.filter(x => arr2.findLastIndex(y => { return x.id == y.id }) < 0)
console.log(arr3) // [{id: 3, name: '王五'}]

4、使用filter和includes获取数组的差集

const arr1 = [1,2,3,4,5]
const arr2 = [3,4,5,6,7]
const arr3 = arr1.filter(x => !arr2.includes(x))
console.log(arr3) // // [1,2] 解析如下： 
// arr1使用filter开始循环，每一项为x，并将arr1中满足条件x => !arr2.includes(x)的x元素push到arr3中 
// arr2使用includes开始检索arr1中传过来的x 
// 当arr2中不包含x时，返回false,取反后为true，此时arr1的filter捕获到true时，便会将x元素push到arr3中

注意：配合includes求交集，includes不适用于对象，所以不能用于数组对象。示例如下：

// 数组对象:求arr1的差集(数组对象借助map方法，将id单独提出来)
const arr1 = [{id:1, name: '张三'},{id:2,name:'李四'},{id:3,name:'王五'}]
const arr2 = [{id:1, name: '张三'},{id:2,name:'李四'},{id:4,name:'孟六'}]
const arr3 = arr2.map(item=>item.id)
const arr4 = arr1.filter(x => arr3.includes(x.id))
console.log(arr4) // [{id: 3, name: '王五'}] 解析如下： 
// arr2通过map方法，将每一项的id存储到arr3中
// arr1使用filter开始循环，每一项为x，并将arr1中满足条件arr3.includes(x.id)的x元素push到arr4中 
// arr3使用includes开始检索arr1中传过来的x.id 
// 当arr3中不包含x.id时，返回false,取反后为true，此时arr1的filter捕获到true时，便会将x元素push到arr4中，包含则返回true，取反后为false，继续向下检索 

5、使用filter和some获取数组的差集

知识点：some用于检测数组中的元素是否满足指定条件，并返回一个布尔值,如果有一个元素满足条件，则返回true , 剩余的元素不会再执行检测;如果没有满足条件的元素，则返回false,继续循环检测下一项元素是否满足指定的条件，直至为true或至最后一个元素，示例如下：

const arr1 = [1,2,3,4,5]
const arr2 = [3,4,5,6,7]
const arr3 = arr1.filter(x => !arr2.some(y => x ==y))
console.log(arr3) // [1,2] 解析如下：
// arr1使用filter开始循环，每一项为x，并将arr1中满足条件!arr2.some(y => x ==y)的x元素push到arr3中
// arr2使用some检索自己的每一项元素与arr1中传过来的x对比，x==y返回true，取反后为false，反之亦然，当x!=y时，取反并返回true
// 当arr1的filter检索到true时，return当前元素到arr3中，直到arr1循环完成

// 数组对象求差集
const arr1 = [{id:1, name: '张三'},{id:2,name:'李四'},{id:3,name:'王五'}]
const arr2 = [{id:1, name: '张三'},{id:2,name:'李四'},{id:4,name:'孟六'}]
const arr3 = arr1.filter(x => !arr2.some(y => x.id == y.id))
console.log(arr3) // [{ "id": 3,"name": "王五"}] 解析同上

6、使用filter和find获取数组的差集

find，用于找出第一个符合条件的数组成员。如果匹配到，则返回该成员，如果没有找到匹配的则返回 undefined。我们在这也可以理解为返回值不等于undefined，就说明该数组中包含其指定的内容，示例如下：

const arr1 = [1,2,3,4,5]
const arr2 = [3,4,5,6,7]
const arr3 = arr1.filter(x => !arr2.find(y => x ==y))
console.log(arr3) // [1,2] 解析如下：
// arr1使用filter开始循环，每一项为x，并将arr1中满足条件!arr2.find(y => x ==y)的x元素push到arr3中
// arr2使用find检索arr1中传过来的x与自己的每一项对比，x==y返回true，取反后为false，反之亦然，当x!=y时，取反并返回true
// 当arr1的filter检索到true时，return当前元素到arr3中，直到arr1循环完成

// 数组对象求差集
const arr1 = [{id:1, name: '张三'},{id:2,name:'李四'},{id:3,name:'王五'}]
const arr2 = [{id:1, name: '张三'},{id:2,name:'李四'},{id:4,name:'孟六'}]
const arr3 = arr1.filter(x => !arr2.find(y => x.id == y.id))
console.log(arr3) // [{ "id": 3,"name": "王五"}] 解析同上

7、使用set方法获取数组的差集

set具有has方法，判断是否包含某个元素，包含返回true，不包含返回false

const arr1 = [1,2,3,4,5,6]
const arr2 = new Set(arr1)
console.log(arr2) // 打印如下图所示，使用set创建的元素就会具有以下属性和方法 has判断是否包含

const arr1 = [1,2,3,4,5]
const arr2 = [3,4,5,6,7]
const arr3 = new Set(arr2) // new Set给arr2赋值给了arr3，arr3便具有了has方法，
const arr4 = arr1.filter(x => !arr3.has(x))
console.log(arr4) // [1,2] 解析如下：
// arr1使用filter开始循环，每一项为x，并将arr1中满足条件!arr3.has(x)的x元素push到arr4中
// arr3使用has方法检索arr1传过来的每一项x
// 包含(具有相同的值)返回true，取反后为false
// 不包含(arr3中不包含arr1中的每一项元素)为false，取反为true
// arr1的filter检索到true时，便会将该项xpush到arr4中