常用数组去重（九种）
作者：互联网
常用数组去重（九种）
项目中数组去重应该是随处可见，今天稍作整理了下（vue）
data() {
return {
oldArray: ["我们的","我们的",'1','abc','abc', 1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, {},{}]
};
}
方法一：两个for循环，然后splice去重（ES5中最常用）//NaN和{}没有去重
for() {
for(var i=0; i<this.oldArray.length; i++){
for(var j=i+1; j<this.oldArray.length; j++){
//第一个等同于第二个，splice方法删除第二个
if(this.oldArray[i] === this.oldArray[j]){
this.oldArray.splice(j,1);
j--;
}
}
}
console.log(this.oldArray); // {0: '我们的', 1: '1', 2: 'abc', 3: 1, 4: 'true', 5: true, 6: 15, 7: false, 8: undefined, 9: null, 10: NaN, 11: NaN, 12: 'NaN', 13: 0, 14: {…}, 15: {…}}
}
方法二：indexof NaN和{}没有去重
indexOf() {
const newArray = [];
this.oldArray.forEach((item) => {
return newArray.indexOf(item) === -1 ? newArray.push(item) : ''
})
console.log(newArray); // ['我们的', '1', 'abc', 1, 'true', true, 15, false, undefined, null, NaN, NaN, 'NaN', 0, Proxy, Proxy]
},
方法三： Set去重：不考虑兼容性，这种去重的方法代码最少。(ES6写法，现在利用babel，基本都可以兼容了) 无法去掉“{}”空对象
set() {
const newArray = Array.from(new Set(this.oldArray)) || [...new Set(this.oldArray)];
console.log(newArray); // ['我们的', '1', 'abc', 1, 'true', true, 15, false, undefined, null, NaN, 'NaN', 0, Proxy, Proxy]
},
方法三：indexof 无法去掉“{}和NaN”空对象
indexOf() {
const newArray = [];
this.oldArray.forEach((item) => {
return newArray.indexOf(item) === -1 ? newArray.push(item) : ''
})
console.log(newArray); // ['我们的', '1', 'abc', 1, 'true', true, 15, false, undefined, null, NaN, NaN, 'NaN', 0, Proxy, Proxy]
},
方法四：利用 includes {}没有去重
includes() {
const newArray = [];
this.oldArray.forEach((item) => {
return newArray.includes( item) ? '' :newArray.push(item);
})
console.log(newArray); // ['我们的', '1', 'abc', 1, 'true', true, 15, false, undefined, null, NaN, 'NaN', 0, Proxy, Proxy]
},
方法五：利用 filter {}没有去除 ，NaN合并成字符串
filter() {
const newArray = this.oldArray.filter((item, index, arr) => { //当前元素，在原始数组中的第一个索引==当前索引值，否则返回当前元素
return arr.indexOf(item, 0) === index;
})
console.log(newArray); // ['我们的', '1', 'abc', 1, 'true', true, 15, false, undefined, null, 'NaN', 0, Proxy, Proxy]
},
方法六：利用 hasOwnProperty 注意：如果两个对象不一样，不能比较对象里的内容
hasOwnProperty() {
const obj = {};
const newArray = this.oldArray.filter((item) => {
return obj.hasOwnProperty(typeof item + item) ? false : (obj[typeof item + item] = true)
})
console.log(newArray); // ['我们的', '1', 'abc', 1, 'true', true, 15, false, undefined, null, NaN, 'NaN', 0, Proxy]
},
方法七：利用reduce+includes {}没有去除
reduce() {
const newArray = this.oldArray.reduce((prev,cur) => prev.includes(cur) ? prev : [...prev,cur],[]);
console.log(newArray); // ['我们的', '1', 'abc', 1, 'true', true, 15, false, undefined, null, NaN, 'NaN', 0, Proxy, Proxy]
},
方法八：利用Map数据结构去重,利用Map的两个方法has和set来判定数组中的每个元素（循环判定是否有该元素，没有的时候，set该元素为true。新数组再添加）在输出一下构造函数Map。 {}没有去除
map() {
let map = new Map();
const newArray = [];
for (let i = 0; i < this.oldArray.length; i++) {
if (!map.has(this.oldArray[i])) {
map.set(this.oldArray[i], true);
newArray.push(this.oldArray[i]);
}
}
console.log(newArray); // ['我们的', '1', 'abc', 1, 'true', true, 15, false, undefined, null, NaN, 'NaN', 0, Proxy, Proxy]
},
方法九：利用sort方法 {}和NaN没有去除
sort() {
//存入排序过后的数组
let formArr = this.oldArray.sort();
//定义一个新数组，并使新数组中的第一个元素等于原数组中的第一个元素
let newArray = [formArr[0]];
for (let i = 1; i < formArr.length; i++) {
if (formArr[i] !== formArr[i - 1]) {
newArray.push(formArr[i]);
}
}
console.log(newArray); // [0, '1', 1, 15, NaN, NaN, 'NaN', Proxy, Proxy, 'abc', false, null, 'true', true, '我们的', undefined]
},
如果有更好，或者不一样的方法，欢迎交流！
标签：常用,oldArray,NaN,item,newArray,数组,九种,true,Proxy 来源： https://blog.csdn.net/MoXinXueWEB/article/details/122347414