JavaScript随手笔记---对比数组差异

• 💌 所属专栏：【JavaScript随手笔记】

• 😀 作  者：我是夜阑的狗🐶

• 🚀 个人简介：一个正在努力学技术的CV工程师，专注基础和实战分享 ，欢迎咨询！

• 💖 欢迎大家：这里是CSDN，我总结知识的地方，喜欢的话请三连，有问题请私信 😘 😘 😘

---

前言

  大家好，又见面了，我是夜阑的狗🐶，本文是专栏【JavaScript随手笔记】专栏的第4篇文章;
  今天的需求中要到两个数组的比较，不相同则进行覆盖，相同则不操作，所以只要对比多两个数组之间的差异即可；
  专栏地址：【JavaScript随手笔记】 ， 此专栏是我是夜阑的狗对JS数据处理的总结，希望能够加深自己的印象，以及帮助到其他的小伙伴😉😉。
  如果文章有什么需要改进的地方还请大佬不吝赐教👏👏。

---

一、方法一：数组拼接

  可以利用concat函数对两个数组进行拼接一个数组，再用filter函数过滤数组并将差异返回成一个新的数组。再对新数组判定就能知道两个数组是否有差异了，下面先简单的介绍这两个函数使用方法；

 1.concat()函数

  语法

array1.concat(array2, array3,…, arrayX)

  参数

参数	描述
array2, array3,…, arrayX	必需。需要连接的数组。

  返回值

类型	描述
Array 对象	返回一个新的数组。该数组是通过把所有 arrayX 参数添加到 arrayObject 中生成的。 如果要进行 concat() 操作的参数是数组，那么添加的是数组中的元素，而不是数组。

 2.filter()函数

  语法

array.filter(function(currentValue,index,arr), thisValue)

  参数

参数	描述
currentValue	必须的，表示当前元素的值
index	可选参数，当前元素的索引值
arr	可选参数，当前元素属于的数组对象
thisValue	可选。对象作为该执行回调时使用，传递给函数，用作 “this” 的值。 如果省略了 thisValue ，“this” 的值为 “undefined”

 3.使用方式

• 差异比较方法：

getArrDifference: function(arr1, arr2){
  return arr1.concat(arr2).filter(function(value, i, arr){
    return arr.indexOf(value) === arr.lastIndexOf(value);
  })
}

• 演示示例：

  可以根据不同的需要来对filter函数进行处理，由于这里只能识别出两个数组有差异即可，就没有做过多的处理； 注意：filter()不会对空数组进行检测、不会改变原始数组。

   var list1 = ["Engineer1", "Engineer2", "Engineer3", "Engineer4", "Engineer5"];
   var list2 = ["Engineer1", "Engineer2", "Engineer1", "Engineer5"];
   var list3 = ["Engineer1", "Engineer3", "Engineer5"];
   var list4 = ["Engineer1", "Engineer4", "Engineer5"];
   console.log(that.getArrDifference(list1,list2)); 
   console.log(that.getArrDifference(list3, list4));

• 运行结果：

二、方法二：数组转字符串

  相比第一种方法，第二种比较简单点，只要用toString()函数将需要比较的数组转换成字符串，再对比即可；

• 差异比较方法：

  getArrDifference: function(arr1, arr2){
    return arr1.toString() != arr2.toString();
  },

• 演示示例：

  当两个字符串不相同时，则返回true进行处理即可；

    var list1 = ["Engineer1", "Engineer2", "Engineer3", "Engineer4", "Engineer5"];
    var list2 = ["Engineer1", "Engineer2", "Engineer1", "Engineer5"];
    var list3 = ["Engineer1", "Engineer3", "Engineer5"];
    var list4 = ["Engineer1", "Engineer4", "Engineer5"];
    console.log(that.getArrDifference(list1,list2)); 
    console.log(that.getArrDifference(list3, list4));

• 运行结果：

---

总结

  感谢观看，如果有帮助到你，请给文章点个赞和收藏，让更多的人看到。🌹 🌹 🌹

  也欢迎你，关注我。👍 👍 👍

  原创不易，还希望各位大佬支持一下，你们的点赞、收藏和留言对我真的很重要！！！💕 💕 💕 最后，本文仍有许多不足之处，欢迎各位认真读完文章的小伙伴们随时私信交流、批评指正！

更多专栏订阅:

• 😀 【LeetCode题解（持续更新中）】
• 🚝 【Java Web项目构建过程】
• 💛 【数字图像处理】
• ⚽ 【JavaScript随手笔记】
• 🤩 【大数据学习笔记（华为云）】
• 🦄 【程序错误解决方法（建议收藏）】
• 🚀 【软件安装教程】

订阅更多，你们将会看到更多的优质内容！！