JS数组去重的几种方法

第一种方法：利用indexOf()

       这种方法的原理是首先定义一个空的数组变量，然后遍历原数组的每一个元素，若在空数组中找不到相同的元素，就将这个元素push给新定义的数组，最后返回新数组。

var arr=[1,2,3,2,1,4,5,8,3,NaN,NaN,"9",9];
function removeRep(arr){
	var temp=[];
	for(var i=0;i<arr.length;i++){
		if(temp.indexOf(arr[i]) === -1){
			temp.push(arr[i]);
		}
	}
	console.log(temp);
}
removeRep(arr);

       去重后新数组为

       可以发现用这种方法对于去除数组中中重复的NaN并不起作用，这是因为indexOf内部使用严格相等运算符（===）进行判断，这会导致对NaN的误判。

第二种方法：利用includes()

       includes()是ES6中用于检查某一个元素是否存在于数组中的方法。这种方法实现原理与indexOf类似，只是includes方法在比较两个NaN时会认为它们是相等的。

function removeFn(arr){
	var temp =[];
	for(var i=0;i<arr.length;i++){
		if(temp.includes(arr[i])==0){
			temp.push(arr[i]);
		}
	}
	console.log(temp);
}
removeFn(arr);

       其最终结果为

       可以发现最终也去掉了重复的NaN。

第三种方法：利用Set数据结构

       Set数据结构是ES6新添加的数据结构之一。Set是不包含重复值的列表。其特点是成员的值都是唯一的，没有重复的值。利用它的这个特点可以将待去重数组以参数形式传入，然后再将set类型的值转换为数组类型。

function moveFn(arr){
	console.log(Array.from(new Set(arr))); //使用Array.from方法将Set结构转换成Array
	//console.log([...new Set(arr)]);  //另外一种转换方法是使用扩展运算符，扩展运算符（...）内部使用for...of循环，所以也可以用于 Set 结构
}
moveFn(arr);

       其最终结果为

       它的效果与includes()方法结果一样。

       综合以上三种方法，最简单也最容易实现的方法就是利用Set数据结构的特性为数组去重。ES6标准中有大量的特性使JS变得更简单，更易用。所以值得去好好学习。