javaScript数组去重的几种实现方式——适用非引用数据去重

 最传统的使用循环遍历

//最传统的使用循环遍历
function getUnique(arr) {
  let newArr = [];
  for (let i = 0; i < arr.length; i++) {
    for (let j = i + 1; j < arr.length; j++) {
      if (arr[i] === arr[j]) {
        i++; //相同丢掉前面的元素
      }
    }
    newArr.push(arr[i]);
  }
  return newArr;
}

 利用Set实现

function getUniqueBySet(arr) {
  return Array.from(new Set(arr));
}

 用forEach结合indexOf或includes实现

将不重复的数据项添加到newArr中

function getUniqueByNewArr(arr) {
  //非重数组
  let newArr = [];
  arr.forEach((item) => {
    if (newArr.indexOf(item) == -1) {
      newArr.push(item);
    }
    // if (!newArr.includes(item)) {
    //   newArr.push(item);
    // }
  });
  return newArr;
}

 利用filter+indexOf实现

比较当前元素数组下标和根据indexOf查找的数组下标是否一致，一致则保留。利用indexOf获取的是多个相同元素只获取首次出现的下标，这样保留了首次出现的数据项。

//filter+indexOf去重

//`indexOf()` 方法用于查找字符串中指定字符或子字符串的首次出现位置。

function getUniqueByFilter(arr) {

  let result = arr.filter((item, index) => {

    //比较当前元素数组下标和根据indexOf查找的数组下标是否一致，一致则保留

    return arr.indexOf(item) === index; //相同数据只保留首次出现

  });

  return result;

}

 reduce+includes方法实现

利用reduce每次循环返回上一步的执行结果，设置每步获取的数组是非重复的。即判断当前循环项是否包含在上一步的数组中，如果不包含，将当前元素追加到上一步执行结果中

//reduce方法实现，利用每次都能获取到上一步的数组执行结果，每次循环将不重复的数据添加并返回
function getUniqueByReduce(arr) {
  let result = arr.reduce((preResult, item) => {
    return preResult.includes(item) ? preResult : [...preResult, item];
  }, []);
  return result;
}

 利用Object.keys实现

 利用对象的key值具有唯一性 将数组中元素作为对象的key，之后用Object.keys获取

function getUniqueByObjectKey(arr) {
  let result = {};
  arr.forEach((item, index) => {
    result[arr[index]] = arr[index];
  });
  return Object.keys(result).map((item)=>~~item);
}