JS数组去重复方法（七种）

hdxx

已于 2022-09-20 10:05:43 修改

阅读量5.4k

点赞数

文章标签： javascript 开发语言 ecmascript

于 2022-08-18 10:09:19 首次发布

本文链接：https://blog.csdn.net/qq_20006765/article/details/126399722

版权

本文详细介绍了JavaScript中实现数组去重的多种方法，包括splice、indexOf、lastIndexOf、includes、forEach+indexOf、filter+indexOf/includes以及使用Set。通过实例代码展示了每种方法的工作原理和使用场景，帮助读者理解并选择适合的去重策略。

摘要由CSDN通过智能技术生成

1、splice

两层循环遍历数组，循环2中值=循环1时，删除该项并使数组长度减1。

var arr=[1,2,3,3,2,'hello','hello'];
// 1.双层for循环
function unique(arr){
	// 第一层for循环控制第一个数
	for(let i=0;i<arr.length;i++){
		// 第二层循环控制第二个数
		for(let j=i+1;j<arr.length;j++){
			// 判断前后是否相等
			if(arr[i]===arr[j]){
				arr.splice(j,1);
				// 修正下标
				j--;
			}
		}
	}
}
unique(arr);
console.log(arr);

2、indexof

创建新数组，使用indexof判断其中是否有原数组中的值，没有的逐项添加进去。

var arr=[1,2,3,3,2,'hello','hello'];
function unique(arr){
	let newArr=[];
	for(let i=0;i<arr.length;i++){
		if(newArr.indexOf(arr[i])===-1){
			newArr.push(arr[i])
		}
	}
	return newArr
}
console.log(unique(arr));

3、lastIndexof

同indexof

var arr=[1,2,3,3,2,'hello','hello'];
function unique(arr){
	let newArr=[];
	for(let i=0;i<arr.length;i++){
		if(newArr.lastIndexOf(arr[i])===-1){
			newArr.push(arr[i])
		}
	}
	return newArr
}
console.log(unique(arr));

4、includes

参数:想要查找的数组元素返回值:false/true

创建新数组，新数组不包含的原数组值，添加进去。

var arr=[1,2,3,4];
console.log(arr.includes(6));
var arr=[1,2,3,3,2,'hello','hello'];
function unique(arr){
	let newArr=[];
	for(let i=0;i<arr.length;i++){
		if(!newArr.includes(arr[i])){
			newArr.push(arr[i])
		}
	}
	return newArr
}
console.log(unique(arr));

5、forEach＋indexOf

forEach遍历原数组，创建新数组，使用indexof判断其中是否有原数组中的值，没有的逐项添加进去。

var arr=[1,2,3,3,2,'hello','hello'];
function unique(arr){
	let newArr=[];
	arr.forEach(function(item){
		if(newArr.indexOf(item)===-1){
			newArr.push(item)
		}
	})
	return newArr;
}
console.log(unique(arr));

6、 filter+indexOf/includes

创建新数组，新数组中每项都用filter添加元素：已有的添加空字符，没有的添加原数组值。

var arr=[1,2,3,3,2,'hello','hello'];
function unique(arr){
	let newArr=[];
	return arr.filter(function(item){
		return newArr.includes(item)?"":newArr.push(item)
	})
	return newArr;
}
console.log(unique(arr));

7、set去重成员是唯一的

var arr=[1,2,3,3,2,'hello','hello'];
let set=new Set(arr);
console.log(set);
console.log(Array.from(set));
console.log([...set]);
map 
var arr=[
	{
		id:1,
		name:"zhangsan"
	},{
		id:2,
		name:"lisi"
	},{
		id:3,
		name:"wangwu"
	}
];
var res=arr.map(function(item){
	return item.name
});
console.log(res);