关于javascript:11种前端数据去重方式你都知道吗

本文总结了JavaScript去重的多种形式，各有优缺点，依据需要正当应用吧。

• 应用 for 循环和 indexOf 办法，复杂度 O(n^2)

function uniqueArray(arr) {  const result = []  for (let i = 0; i < arr.length; i++) {    if (result.indexOf(arr[i]) === -1) {      result.push(arr[i])    }  }  return result}

• 应用 for 循环和对象，复杂度 O(n^2)

function uniqueArray(arr) {  const result = []  const obj = {}  for (let i = 0; i < arr.length; i++) {    if (!obj[arr[i]]) {      result.push(arr[i])      obj[arr[i]] = true    }  }  return result}

• 应用 filter 办法和 indexOf 办法，复杂度 O(n^2)

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

• 应用 filter 办法和对象，复杂度 O(n)

function uniqueArray(arr) {  const obj = {}  return arr.filter((item) => obj.hasOwnProperty(item) ? false : (obj[item] = true))}

• 应用 Set 数据结构，复杂度 O(n)

function uniqueArray(arr) {  return Array.from(new Set(arr))}// 应用解构 + Setfunction uniqueArray(arr) {  return [...new Set(arr)]}

• 应用 Map 数据结构，复杂度 O(n)

function uniqueArray(arr) {  const map = new Map();  const result = [];  for (let i = 0; i < arr.length; i++) {    if (!map.has(arr[i])) {      map.set(arr[i], true);      result.push(arr[i]);    }  }  return result;}// orfunction uniqueArray(arr) {  const map = new Map();  return arr.filter(function(item) {    return !map.has(item) && map.set(item, true);  });}

• 应用双重循环和 splice 办法，复杂度 O(n^2)

function uniqueArray(arr) {  for (var i = 0; i < arr.length; i++) {    for (var j = i + 1; j < arr.length; j++) {      if (arr[i] === arr[j]) {        arr.splice(j, 1);        j--;      }    }  }  return arr;}

• 应用排序和双指针

应用排序和双指针能够实现 O(nlogn) 的工夫复杂度。先对数组进行排序，而后应用双指针遍历数组，如果左指针和右指针指向的值雷同，就把右指针向右挪动，直到找到不同的值，而后把左指针向右挪动，持续遍历。

function uniqueArray(arr) {  arr.sort();  var left = 0, right = 1;  var result = [];  while (right <= arr.length) {    if (arr[left] === arr[right]) {      right++;    } else {      result.push(arr[left]);      left = right;      right++;    }  }  return result;}

• 应用 reduce 办法和 includes，复杂度 O(n^2)

function uniqueArray(arr) {  return arr.reduce(function(prev, cur) {    if (!prev.includes(cur)) {      prev.push(cur);    }    return prev;  }, []);}

• 应用递归和 includes，复杂度 O(n^2)

function uniqueArray(arr) {  if (arr.length === 1) {    return arr;  } else {    const first = arr[0];    const rest = uniqueArray(arr.slice(1));    if (rest.includes(first)) {      return rest;    } else {      return [first].concat(rest);    }  }}

• 双层循环，复杂度 O(n^2)

function uniqueArray(arr) {  var result = [];  for (var i = 0; i < arr.length; i++) {    for (var j = 0; j < result.length; j++) {      if (arr[i] === result[j]) {        break;      }    }    if (j === result.length) {      result.push(arr[i]);    }  }  return result;}