6种数组去重的方法

1. 使用双重for循环

要比较数组中的每个值咱们均可以用双重for循环来解决，好比冒泡排序。
一样也能够使用双重for循环来数组去重。
[JavaScript] 纯文本查看 复制代码
?

function unique(arr) {

for (let i = 0; i < arr.length; i++) {

for (let j = i+1; j < arr.length; j++) {

  if (arr == arr[j]) {

    arr.splice(j,1)

    j--

  }

}

}

return arr

}

let arr = [1,1,'true','true', 'a', 'a',true,true,false,false, undefined,undefined, null,null, NaN, NaN,'NaN','NaN', 0, 0,{},{},[],[]];

console.log(unique(arr)) // [ 1, 'true', 'a', false, undefined, NaN, NaN, 'NaN', {}, {} ]

能够看见NaN没有被去除掉，两个{}都没去掉，由于{}是引用值，而却咱们使用的是arr == arr[j]会发生类型转换，因此如下都为true：

[JavaScript] 纯文本查看 复制代码
?

1 == true

false== []

undefined == null

false == 0

要解决以上问题咱们能够使用Object.is(arr, arr[j])的方法替换arr==arr[j]既能够去除NaN还能够防止发生类型转换。
代码这里接不贴出了，你们能够本身写一下运行一下。
注：为了方便如下arr都使用该处的arr值

1. 利用indexOf()

使用indexOf()，能够判断一个数组中是否包含某个值，若是存在则返回该元素在数组中的位置，若是不存在则返回-1。
[JavaScript] 纯文本查看 复制代码
?

functon unique(arr) {

let res = []

      for (let i = 0; i < arr.length; i++) {

    if (res.indexOf(arr) === -1) {

              res.push(arr)

    }

      }

      return res

}

console.log(unique(arr)) //[ 1, 'true', 'a', true, false, undefined, null, NaN, NaN, 'NaN', 0, {}, {}, [], []]

这里咱们新建一个数组来保存去重后的数组，若是该数组不包含元素就将该元素push到该数组中，能够发现这种方法任然没有去掉NaN、{}、[]。

1. 利用includes()

使用includes()方法也能够判断数组是否包含某个特定的元素，若是包含就返回true不包含就返回false。这和indexOf()方法有些相似，因此咱们使用includes()进行数组去重和indexOf()的方法原理是同样的。
[JavaScript] 纯文本查看 复制代码
?

functon unique(arr) {

let res = []
for (let i = 0; i < arr.length; i++) {
    if (!res.includes(arr)) {
              res.push(arr)
    }
}
return res

}

1. 利用filter()

filter() 方法建立一个新的数组，新数组中的元素是经过检查指定数组中符合条件的全部元素。
而且filter()不会改变数组，也不会对空数组进行检测。filter()方法接收一个回调函数。
语法：
[JavaScript] 纯文本查看 复制代码
?
1
array.filter(function(item,index,arr), thisValue)

参数 描述
item 必须。当前元素的值
index 可选。当前元素的索引值
arr 可选。当前元素属于的数组对象

代码实现
[JavaScript] 纯文本查看 复制代码
?

function unique(arr) {

return arr.filter((item,index, arr) => {
    return arr.indexOf(item) === index
})

}
console.log(unique(arr)) //[ 1, 'true', 'a', true, false, undefined, null, 'NaN', 0, {}, {}, [], [] ]

这里咱们用判断indexOf(item)判断当前元素的索引是否等于当前index，若是相等就返回该元素。

1. 使用对象的特色

对象是一种以键值对存储信息的结构，而且不能有重复的键。
[JavaScript] 纯文本查看 复制代码
?

function unique(arr) {
let obj = {}
for (let i = 0; i < arr.length; i++) {

if (arr in obj) {
  obj[arr] ++
} else {
  obj[arr] = 10
}

}
return Object.keys(obj) // 以数组的形式返回键
}
console.log(unique(arr)) // [ '0', '1', 'true', 'a', 'false', 'undefined', 'null', 'NaN', '[object Object]', '']

这种方法的写出来有点问题，由于是用Object.keys(obj)来返回键的集合因此获得的都是字符串的形式。

1. 使用set

ES6 提供了新的数据结构 Set。它相似于数组，可是成员的值都是惟一的，没有重复的值。
[JavaScript] 纯文本查看 复制代码
?

function unique(arr) {
return [...new Set(arr)]
}
console.log(unique(arr)) //[ 1, 'true', 'a', true, false, undefined, null, NaN, 'NaN', 0, {}, {}, [], [] ]

这是ES6最经常使用的方法，获得的效果也还不错。更多技术资讯可关注：gzitcast