<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
var arr = [1, "22", "11", 2, 1, 1, 22, 3, 0];
/*
1. ES6方法
ES6提供了新的数据结构Set。它类似于数组,但是成员的值都是唯一的,没有重复的值。
Set函数可以接受一个数组(或类似数组的对象)作为参数,用来初始化
*/
function unique1(arr) {
// 1.转为数组
// return Array.from(new Set(arr));
// 2. 数组解构
return [...new Set(arr)]
}
console.log(unique1(arr));//[1, "22", "11", 2, 22, 3, 0]
/*
2. 双重for循换,splice() 去重
如果重复,删除一项
*/
function unique2(arr) {
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--;
}
}
}
return arr;
}
// console.log(unique2(arr));// [1, "22", "11", 2, 22, 3, 0]
/*
3.使用indexof去重
另创建一个数组array,遍历arr,如果在array中没有找到这个数据,就加入array
*/
function unique3(arr) {
if (Array.isArray(arr) === false) {
console.log("TypeError");
return;
}
var array = [];
for (let i = 0; i < arr.length; i++) {
if (array.indexOf(arr[i]) === -1) {
array.push(arr[i]);
}
}
return array;
}
// console.log(unique3(arr));//[1, "22", "11", 2, 22, 3, 0]
/*
4.使用sort() 去重
先对arr排序,然后遍历,不重复的值加入array
*/
function unique4(arr) {
if (Array.isArray(arr) === false) {
console.log("TypeError");
return;
}
arr.sort();
var array = [arr[0]];
for (let i = 1; i < arr.length; i++) {
if (arr[i] !== arr[i - 1]) {
array.push(arr[i]);
}
}
return array;
}
// console.log(unique4(arr));//[0, 1, "11", 2, "22", 22, 3]
/*
5. 使用includes 检查数组中是否有某个值
遍历arr, array中没有含有则push进去
*/
function unique5(arr) {
if (Array.isArray(arr) === false) {
console.log("TypeError");
return;
}
var array = [];
for (let i = 0; i < arr.length; i++) {
if (!array.includes(arr[i])) {//includes ,没有含有则false
array.push(arr[i]);
}
}
return array;
}
// console.log(unique5(arr));// [1, "22", "11", 2, 22, 3, 0]
/*
6. 使用hasOwnProperty,使用filter
typeof item + item 值为 类型+值 如: number1 string22
*/
function unique6(arr) {
var obj = {};
return arr.filter(function (item, index, arr) {
// typeof item + item 值为 类型+值 如: number1 string22
return obj.hasOwnProperty(typeof item + item) ? false : (obj[typeof item + item] = true)
})
}
// console.log(unique6(arr));// [1, "22", "11", 2, 22, 3, 0]
/*
7. 使用filter 过滤,true 留下
从数组0下标开始查找item,如果找到的第一个item 的下标 与当前下标值相同,则为true
*/
function unique7(arr) {
return arr.filter(function (item, index, arr) {
//当前元素,在原始数组中的第一个索引 == 当前索引值,否则返回当前元素
return arr.indexOf(item, 0) === index;
});
}
// console.log(unique7(arr));// [1, "22", "11", 2, 22, 3, 0]
/*
8. 递归去重
*/
function unique8(arr) {
var array = arr;
var len = array.length;
array.sort(function (a, b) { //排序后更加方便去重,从小到大
return a - b;
})
//递归函数
function loop(index) {
if (index >= 1) {
if (array[index] === array[index - 1]) {
array.splice(index, 1);
}
loop(index - 1); //递归loop,然后数组去重
}
}
loop(len - 1);
return array;
}
// console.log(unique8(arr))//[0, 1, 2, 3, "11", "22", 22]
/*
9. 利用Map数据结构去重
创建一个空Map数据结构,遍历需要去重的数组,把数组的每一个元素作为key存到Map中。
由于Map中不会出现相同的key值,所以最终得到的就是去重后的结果。
*/
function unique9(arr) {
let map = new Map();
let array = [];
for(let i = 0; i < arr.length; i++) {
if(map.has(arr[i])) {//如果已经有这一项
map.set(arr[i] , true);
}else {//如果还没有这个key
map.set(arr[i], false);
array.push(arr[i]);
}
}
return array;
}
// console.log(unique9(arr));// [1, "22", "11", 2, 22, 3, 0]
/*
10. 使用reduce 与includes去重
reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。
*/
function unique10(arr) {
return arr.reduce((prev, cur) => prev.includes(cur) ? prev : [...prev, cur], []);
}
// console.log(unique10(arr));// [1, "22", "11", 2, 22, 3, 0]
</script>
</body>
</html>