js 两个数组（对象）去重合并

项目前台代码中需要用到数组的去重操作，其实也不难，就算是对象数组，判断下对应的属性值也是可以实现的，但是如果我实现的话肯定是最常见的双重for循环，加个flag标记，老套的不能行了，想了想，还是上网找点高级点的操作吧。下面几个方法都是网上找的，链接如下：

https://blog.csdn.net/NAMECZ/article/details/82220534

https://blog.csdn.net/u012830533/article/details/73551104

js去重方法有很多，最常用也是最基本的如下：（这个我没试过，估计没啥问题，最基础的）

<script type="text/javascript">
	var array = [1, 1, '1', '1'];
	
	function uq(array) {
	    var del = [];
	    for (var i = 0, arrayLen = array.length; i < arrayLen; i++) {
	        for (var j = 0, delLen = del.length; j < delLen; j++ ) {
	            if (array[i] === del[j]) {
	                break;
	            }
	        }
	        if (j === delLen) {
	            del.push(array[i])
	        }
	    }
	    return del;
	}
</script>

在ES 6中则能更简便的实现：

<script type="text/javascript">
	var array = [1, 2, 1, 1, '1', '一'];
	//构建带array,array1两个参数的函数
	function uq(array) {
		//将array数组转换成set对象,再使用Array.from()方法将set对象转换成数组
		return Array.from(new Set(array));
	}
	//查看输出结果
	console.log(uq(array)); // [1, 2, "1", "一"]
</script>

如若要将多个数组合并且去重排序，则需要使用add()方法插入新数据并使用sort()方法排序，具体如下：

<script type="text/javascript">
	//定义两个数组
	var array = [1, 2, 1, 1, '1', '一'];
	var array1 = [1, '二', 2, '一', 3, 4, '5', '1', '6'];
	//构建带array,array1两个参数的函数
	function uq(array, array1) {
		//将array数组转换成set对象
		setObj = new Set(array)
		//循环数组array1，并将值通过add插入set对象中,此时重复数据并不会插入其中
		for(i = 0; i < array1.length; i++) {
			setObj.add(array1[i]);
		}
		//使用Array.from()方法将set对象转换成数组，并使用sort()方法排序
		return Array.from(setObj).sort();
	}
	
	//查看输出结果
	console.log(uq(array, array1)); // [1, "1", 2, 3, 4, "5", "6", "一", "二"]
</script>

因为我这边操作的是对象，所以上面的我都没测，下面的测试过了，可以实现。

这次对数组的操作，我们使用es6的新语法来完成，所以在看下边代码之前，我们要了解我们下边要用到的es6中的set集合，和for...of 方法：
首先介绍set集合：

ES6提供了新的数据结构Set,它类似于数组，但是成员的值都是唯一的，没有重复的值。

Set函数可以接受一个数组（或类似数组的对象）作为参数，用来初始化。

注意：

向set加入值的时候，不会发生类型转变，所以 5 和 '5' 是两个不同的值。Set内部判断两个值是否相同，用的是类似于 "==="的算法，但是区别是，在set内部认为NaN 等于 NaN ；

Set实例的属性和方法：

Set结构的实例有以下属性。

    Set.prototype.constructor：构造函数，默认就是Set函数。
    Set.prototype.size：返回Set实例的成员总数。

Set实例的方法分为两大类：操作方法（用于操作数据）和遍历方法（用于遍历成员）。下面先介绍四个操作方法。

    add(value)：添加某个值，返回Set结构本身。
    delete(value)：删除某个值，返回一个布尔值，表示删除是否成功。
    has(value)：返回一个布尔值，表示该值是否为Set的成员。
    clear()：清除所有成员，没有返回值。

Set内部的元素可以用 for...of 遍历。

Array.from()方法可以将Set数据类型转化为数组类型。
for...of 方法：

通俗一点的讲，就是遍历的是数组的元素值，需要深入了解的同学，请自行百度，这里就不赘述。

1、数组的合并去重

let arr1 = [3,5,2,3,6];
let arr2 = [5,2,4,6,8,7,9,2];
let arr = arr1.concat(arr2);  //合并数组
let arrNew= new Set(arr); //通过set集合去重
 
console.log("arrNew",Array.from(arrNew)); //将set集合转化为数组

2、数组对象的合并去重

let json1=[
	{id:1,name:"aaa"},
	{id:2,name:"bbb"},
	{id:3,name:"ccc"},
] 
let json2=[
	{id:1,name:"aaa"},
	{id:2,name:"bbb"},
	{id:4,name:"ddd"},
]
let json = json1.concat(json2); //两个数组对象合并
let newJson = []; //盛放去重后数据的新数组
for(item1 of json){  //循环json数组对象的内容
	let flag = true;  //建立标记，判断数据是否重复，true为不重复
	for(item2 of newJson){  //循环新数组的内容
		if(item1.id==item2.id){ //让json数组对象的内容与新数组的内容作比较，相同的话，改变标记为false
			flag = false;
		}
	}
	if(flag){ //判断是否重复
		newJson.push(item1); //不重复的放入新数组。  新数组的内容会继续进行上边的循环。
	}
}
console.log("newJson",newJson);

项目起不来了，暂时不截console的图了。

这里面可以实现去重，如果是要将两个数组中的重复数据剔除，只留下唯一数据的话，就不需要合并数组，两个for循环，依次遍历两个数组即可。