js 数组去重的几种方式及原理
let arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];
/ 该方法最佳
// 该hasOwnProperty()方法返回一个布尔值，指示对象是否具有指定的属性作为其自己的属性
// const object1 = new Object();
// object1.property1 = 42;
// console.log(object1.hasOwnProperty('property1'));
// // expected output: true
// console.log(object1.hasOwnProperty('toString'));
// // expected output: false
// console.log(object1.hasOwnProperty('hasOwnProperty'));
// // expected output: false
// 该方法与第二种使用的indexOf的特性有异曲同工之妙，同样是用filter做过滤，判断当前obj是否有遍历的参数
// 没有就添加进去，有的话就跳过
function unique4(params) {
let obj = {};
return arr.filter((item,index,arr)=>{
return obj.hasOwnProperty(typeof item + item)?false:(obj[typeof item + item] = true)
})
}
console.log(unique4(arr))
// 利用ES6 set 去重
function unique1(arr) {
return Array.from(new Set(arr))
}
console.log(unique1(arr))
// Array.from() 方法从一个类似数组或可迭代对象中创建一个新的数组实例。
// console.log(Array.from('foo'));
// expected output: Array ["f", "o", "o"]
// console.log(Array.from([1, 2, 3], x => x + x));
// expected output: Array [2, 4, 6]
// Set 对象允许你存储任何类型的唯一值，无论是原始值或者是对象引用。下边是地址
// https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Set
// 数组去重
// 方法。 indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。
// 利用indexOf 检索的字符串值没有出现，则该方法返回 -1。
function unique2(params) {
let temp = [];
let len = params.length;
for(let i = 0; i < len; i++) {
if(temp.indexOf(params[i]) === -1) {
temp.push(params[i]);
}
}
return temp;
}
console.log(unique2(arr))
// item 必须。当前元素的值 index 可选。当前元素的索引值 arr可选。当前元素属于的数组对象
// 特别点：利用filter作为for循环，使用indexOf(item,0)拿到当前索引的下标，做对比
function unique3(params) {
return params.filter((item,index,arr)=>{
return arr.indexOf(item,0) === index;
})
}
console.log(unique3(arr))
// includes() 方法用来判断一个数组是否包含一个指定的值，根据情况，如果包含则返回 true，否则返回false。
// var array1 = [1, 2, 3];
// console.log(array1.includes(2));
// expected output: true
// var pets = ['cat', 'dog', 'bat'];
// console.log(pets.includes('cat'));
// expected output: true
// console.log(pets.includes('at'));
// expected output: false
function unique5(params) {
// if(!Array.isArray(arr)) { // 用于确定传递的值是否是一个 Array。
// console.log('type error');
// return
// }
let array = [];
let len = params.length;
for(let i = 0; i < len; i++) {
if(!array.includes(arr[i])) {
array.push(arr[i]);
}
}
return array;
}
console.log(unique5(arr))
// 该reduce()方法在数组的每个成员上执行reducer函数（您提供），从而生成单个输出值。
const array1 = [1, 2, 3, 4];
// const reducer = (accumulator, currentValue) => accumulator + currentValue;
// 1 + 2 + 3 + 4
// console.log(array1.reduce(reducer));
// expected output: 10
// 5 + 1 + 2 + 3 + 4
// console.log(array1.reduce(reducer, 5));
// expected output: 15
// 该方法的思路依然是reduce作循环，利用includes判断是否有这个参数，没有的话就放进返回数组里
function unique6(params) {
return params.reduce((prev,cur)=> prev.includes(cur)? prev: [...prev,cur],[]);
}
console.log(unique6(arr));
// set() 方法为 Map 对象添加或更新一个指定了键（key）和值（value）的（新）键值对。
// has()返回一个布尔值，指示项是否存在具有指定键的项。
// 思路：首先在空的map实例中判断是否有当前Boolean值，如有没有进入else
// 将当前值存入map,再当前值push进入array，
// 如果当前值存在map里，就将当前值再放入map中
function unique7(params) {
let map = new Map();
let array = new Array();
let len = params.length;
for(let i = 0; i < len; i++) {
if(map.has(params[i])) {
map.set(params[i], true)
}else {
map.set(params[i], false)
array.push(params[i])
}
}
return array;
}
console.log(unique7(arr));
// 该sort()方法对数组中的元素进行排序并返回该数组。默认排序顺序是在将元素转换为字符串，
// 然后比较它们的UTF-16代码单元值序列时构建的。
// 由于它取决于实现，因此无法保证排序的时间和空间复杂性
function unique8(params) {
// if(!Array.isArray(params)) {
// console.log('type error!')
// return;
// }
params = params.sort();
let array = [params[0]];
let len = params.length;
for(let i = 1; i < len; i++) {
if(params[i] !== arr[i-1]) {
array.push(arr[i])
}
}
return array;
}
console.log(unique8(arr));//NaN、{}没有去重
function unique9(params){
for(let i=0; i<params.length; i++){
for(let j=i+1; j<params.length; j++){
if(params[i]==params[j]){ //第一个等同于第二个，splice方法删除第二个
params.splice(j,1);
j--;
}
}
}
return params;
}
console.log(unique9(arr));//NaN、{}没有去重
参考地址： https://segmentfault.com/a/1190000016418021
