js 数组去重方法（set+array.from,includes,,filter,indexof,set+map）

es6语法：利用Set()+Array.from()方法。

ES6 提供了新的数据结构 Set。它类似于数组，但是成员的值都是唯一的，没有重复的值。

Array.from方法用于将两类对象转为真正的数组：类似数组的对象（array-like object）和可遍历（iterable）的对象（包括ES6新增的数据结构Set和Map）。

let array = ['苹果','锤子','三星','华为','锤子','苹果','小米','锤子',NaN,NaN];
const result = Array.from(new Set(array)) //['苹果', '锤子', '三星', '华为', '小米',NaN]

利用数组的indexOf方法

indexOf() 方法可返回数组中某个指定的元素位置。

该方法将从头到尾地检索数组，看它是否含有对应的元素。开始检索的位置在数组 start 处或数组的开头（没有指定 start 参数时）。如果找到一个 item，则返回 item 的第一次出现的位置。开始位置的索引为 0。

注意此方法：NaN不能去重。

let array = ['苹果','锤子','三星','华为','锤子','苹果','小米','锤子',NaN,NaN];
function removeDuplicate(arr) {
  const newArr = []
  arr.forEach(item => {
    if (newArr.indexOf(item) === -1) {
      newArr.push(item)
    }
  })
  return newArr // 返回一个新数组
}
let result = removeDuplicate(arr)
console.log(result)//['苹果', '锤子', '三星', '华为', '小米',NaN,NaN]

利用filter+indexOf方法：

filter() 方法创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。

indexOf() 方法可返回数组中某个指定的元素位置。

let array = ['苹果','锤子','三星','华为','锤子','苹果','小米','锤子',NaN,NaN];
let result = array.filter((el,index,arr) => {
　　return arr.indexOf(el) == index
});
console.log(result)//['苹果', '锤子', '三星', '华为', '小米']

注意：这里的输出结果中不包含NaN，是因为indexOf()无法对NaN进行判断，即arr.indexOf(item) === index返回结果为false。

测试如下

let array = ['苹果','锤子','三星','华为','锤子','苹果','小米','锤子',NaN,NaN];
console.log(array.indexOf(NaN)) // -1

利用数组的includes方法

includes()方法：用来判断一个数组是否包含一个指定的值，根据情况，如果包含则返回 true，否则返回 false。

includes能够检测到数组中包含NaN

let arr = ['苹果','锤子','三星','华为','锤子','苹果','小米','锤子',NaN,NaN];
function removeDuplicate(arr) {
  const newArr = []
  arr.forEach(item => {
    if (!newArr.includes(item)) {
      newArr.push(item)
    }
  })
  return newArr
}

const result = removeDuplicate(arr)
console.log(result) //['苹果', '锤子', '三星', '华为', '小米',NaN]

利用Map()

ES6提供了Map数据结构。它类似于对象，也是键值对的集合，但是“键”的范围不限于字符串，各种类型的值（包括对象）都可以当作键。将数组元素作为map的键存入，结合has()和set()方法判断键是否重复。

let arr = ['苹果','锤子','三星','华为','锤子','苹果','小米','锤子',NaN,NaN];
function removeDuplicate(arr) {
  const map = new Map();
  const newArr = [];
  arr.forEach(item => {
    if (!map.has(item)) { // has()用于判断map是否包为item的属性值
      map.set(item, true) // 使用set()将item设置到map中，并设置其属性值为true
      newArr.push(item)
    }
  })

  return newArr
}
const result = removeDuplicate(arr)
console.log(result) //['苹果', '锤子', '三星', '华为', '小米',NaN]

利用对象

其实现思想和Map()是差不多的，主要是利用了对象的属性名不可重复这一特性。

let arr = ['苹果','锤子','三星','华为','锤子','苹果','小米','锤子',NaN,NaN];
function removeDuplicate(arr) {
  const newArr = []
  const obj = {}

  arr.forEach(item => {
    if (!obj[item]) {
      newArr.push(item)
      obj[item] = true
    }
  })

  return newArr
}
const result = removeDuplicate(arr)
console.log(result) //['苹果', '锤子', '三星', '华为', '小米',NaN]