JavaScript数组的去重
数组的去重在我们的日常开发中有时候会使用到,但是一般都是后端去进行数据的去重操作。
但是在面试当中我们经常会被面试官问到数组去重的方法有哪些?那么我们就来看看数组的去重都有哪些可以实现的方式。
1.利用 new Set()
// 利用ES6中Set构造函数生成Set数据结构,然后利用Array.from()方法进行转换(比较常用且方便)
function unique (arr) {
return Array.from(new Set(arr))
// return [...new Set(arr)] 同样可行,只是简化了代码
}
const arr1 = [1, 1, 'true', 'true', true, true, 15, 15, false, false, undefined, undefined, null, null, NaN, NaN, 'NaN', 0, 0, 'a', 'a', {}, {}];
console.log(unique(arr1))
// [1, 'true', true, 15, false, undefined, null, NaN, 'NaN', 0, 'a', {…}, {…}]
注意:不考虑兼容性的情况下,这种代码是最少的,但是这种方法不能够去除空对象{...},需要使用高阶方法。
2.利用 Array.sort()
// 利用sort进行排序方法,根据排序后的结果进行遍历及相邻元素对比
function unique (arr) {
if (!Array.isArray(arr)) {
return
}
arr = arr.sort()
console.log(JSON.stringify(arr), 'arr---------')
// [0,0,1,1,15,15,null,null,"NaN",{},{},"a","a",false,false,null,null,"true","true",true,true,null,null]
const array = [arr[0]]
console.log(JSON.stringify(array), 'array-----')
// [0]
for (let i = 1; i < arr.length; i++) {
if (arr[i] !== arr[i - 1]) {
array.push(arr[i])
}
}
return array
}
const arr1 = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}]
console.log(unique(arr1), 'unique--------------')
// [0, 1, 15, NaN, NaN, 'NaN', {…}, {…}, 'a', false, null, 'true', true, undefined]
注意:没有去除NaN和空对象{...}
3.利用 Array.splice()
// 利用for循环嵌套,然后splice去重
function unique (arr) {
for (var i = 0; i < arr.length; i++) {
for (var j = i + 1; j < arr.length; j++) {
if (arr[i] == arr[j]) { //第一个等同于第二个,splice方法删除第二个
arr.splice(j, 1);
j--;
}
}
}
return arr;
}
let arr1 = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}]
console.log(unique(arr1))
// [1, "true", 15, false, undefined, NaN, NaN, "NaN", "a", {…}, {…}]
注意:NaN和{}没有去重,两个null直接消失了
4.利用 Array.indexof()
// 利用数组indexof方法查找该元素是否存在
function unique(arr) {
if (!Array.isArray(arr)) {
return
}
let array = []
for (let i = 0; i < arr.length; i++) {
if (array.indexOf(arr[i]) === -1) {
array.push(arr[i])
}
}
return array
}
var arr1 = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}]
console.log(unique(arr1))
// [1, 'true', true, 15, false, undefined, null, NaN, NaN, 'NaN', 0, 'a', {…}, {…}]
注意:没有去除NaN和空对象{...}
你们会发现上面的这些方法中都是可以简单去重,但是无法去除空对象和NaN,不够严格的情况下可行,但是严格情况下的话就需要用到hasOwnProperty()
5.利用 hasOwnProperty()
function unique(arr) {
if (!Array.isArray(arr)) {
return
}
const obj = {}
return arr.filter((item,index,arr) => {
return obj.hasOwnProperty(typeof item + item) ? false : (obj[typeof item + item] = true)
})
}
const arr1 = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}]
console.log(unique(arr1))
// [1, 'true', true, 15, false, undefined, null, NaN, 'NaN', 0, 'a', {…}]
这个方法可以所有都去重,其实还有很多方法可以进行简单的去重,具体要看严格性。