今天学习一下「数组去重」的多种办法！

双层 for 循环

  1. var arr = [1, 1, 2, 6, 3, 5, 0, 3, 6, 8, 9, 4, 4, 2, 0, 9, 5, 2];
  3. function unqueArr(array) {
  4.   var _arr = [];
  5.   var isRepeat;
  7.   for (let i = 0; i < array.length; i++) {
  8.     isRepeat = false;
  9.     for (let j = 0; j < _arr.length; j++) {
  10.       // 比较 _arr 和 array 的每一项
  11.       if (_arr[j] === array[i]) {
  12.         isRepeat = true;
  13.         break;
  14.       }
  15.     }
  16.     // 如果为 false 说明 _arr 中不存在
  17.     if (!isRepeat) {
  18.       _arr.push(array[i]);
  19.     }
  20.   }
  21.   return _arr;
  22. }
  23.   console.log(unqueArr(arr)); // [1, 2, 6, 3, 5, 0, 8, 9, 4]

filter + indexOf

  1. var arr = [1, 1, 2, 6, 3, 5, 0, 3, 6, 8, 9, 4, 4, 2, 0, 9, 5, 2];
  3. function unqueArr1(array) {
  4.   return array.filter(function (item, index) {
  5.     // indexOf() 会返回数据在数组中第一个位置
  6.     // 假如 indexOf(1) 返回 0
  7.     // 所以就是 indexOf(1) = 0 和 index = 0 比较为 true
  8.     // 如果是 indexOf(1) = 0 和 index = 1 比较为 false
  9.     return array.indexOf(item) === index;
  10.   });
  11. }
  12. console.log(unqueArr1(arr)); // [1, 2, 6, 3, 5, 0, 8, 9, 4]

forEach + indexOf

  1. var arr = [1, 1, 2, 6, 3, 5, 0, 3, 6, 8, 9, 4, 4, 2, 0, 9, 5, 2];
  3. function unqueArr2(array) {
  4.   var _arr = [];
  6.   array.forEach((element) => {
  7.     if (_arr.indexOf(element) === -1) {
  8.       _arr.push(element);
  9.     }
  10.   });
  11.   return _arr;
  12. }
  13. console.log(unqueArr2(arr)); // [1, 2, 6, 3, 5, 0, 8, 9, 4]

forEach + includes

这个方法个indexOf是一样的道理，都是检查新数组中是否存在某个值。 :::info includes检查数组中是否包含某个元素，返回true或者false
indexOf检查数组中是否包含某个元素，返回该元素在数组中的下标

indexOf对NaN数据是无效的，会返回-1 :::

  1. var arr = [1, 1, 2, 6, 3, 5, 0, 3, 6, 8, 9, 4, 4, 2, 0, 9, 5, 2];
  3. function unqueArr3(array) {
  4.   var _arr = [];
  5.   array.forEach((item) => {
  6.     if (!_arr.includes(item)) {
  7.       _arr.push(item);
  8.     }
  9.   });
  10.   return _arr;
  11. }
  12. console.log(unqueArr3(arr)); // [1, 2, 6, 3, 5, 0, 8, 9, 4]

for + sort

  1. var arr = [1, 1, 2, 6, 3, 5, 0, 3, 6, 8, 9, 4, 4, 2, 0, 9, 5, 2];
  3. function unqueArr4(array) {
  4.   var _arr = [];
  6.   array.sort();
  7.   // 排序后
  8.   // [0, 0, 1, 1, 2, 2, 2, 3, 3, 4, 4, 5, 5, 6, 6, 8, 9, 9]
  10.   for (let i = 0; i < array.length; i++) {
  11.     // 该方法原理就是用数组的前一项和后一项进行对比
  12.     // 0 !== 0 返回 false，所以就不会 push
  13.     // 0 !== 1 返回 true，所以就会 push(0)
  14.     // 1 !== 1 返回 false，所以就不会 push
  15.     // 1 !== 2 返回 true，所以就会 push(1)
  16.     if (array[i] !== array[i + 1]) {
  17.       _arr.push(array[i]);
  18.     }
  19.   }
  21.   return _arr;
  22. }
  23. console.log(unqueArr4(arr));  // [1, 2, 6, 3, 5, 0, 8, 9, 4]

sort + reduce

该方法的道理和for + sort的方式道理是一样的

  1. var arr = [1, 1, 2, 6, 3, 5, 0, 3, 6, 8, 9, 4, 4, 2, 0, 9, 5, 2];
  3. function unqueArr5(array) {
  4.   // 先排序
  5.   // [0, 0, 1, 1, 2, 2, 2, 3, 3, 4, 4, 5, 5, 6, 6, 8, 9, 9]
  6.   return array.sort().reduce((prev, item) => {
  7.     // 0 肯定是满足条件所以 push(0) , [0]
  8.     // prev[prev.length - 1] 也就是 0, 0 !== 0 返回 false 所以不会push
  9.     // 然后 prev[prev.length - 1] 还是 0，0 !== 1 返回 true，所以就会 push(1)，[0, 1]
  10.     // 然后 prev[prev.length - 1] 拿到 1 ，1 和 1 比较返回 false 所以不会 push
  11.     if (prev.length === 0 || prev[prev.length - 1] !== item) {
  12.       prev.push(item);
  13.     }
  14.     return prev;
  15.   }, []);
  16. }
  17. console.log(unqueArr5(arr)); // [1, 2, 6, 3, 5, 0, 8, 9, 4]

for + map

  1. var arr = [1, 1, 2, 6, 3, 5, 0, 3, 6, 8, 9, 4, 4, 2, 0, 9, 5, 2];
  3. function unqueArr6(array) {
  4.   var _arr = [];
  5.   var _temp = new Map();
  7.   for (let index = 0; index < array.length; index++) {
  8.     // 如果 map 中没有 1 这个属性就会添加到 map 对象中 Map{1:1}
  9.     // 如果 map 中没有 2 这个属性就会添加到 map 对象中 Map{1:1, 2:1}
  10.     if (!_temp.get(array[index])) {
  11.       // 添加到 map 对象里，方便下次判断
  12.       _temp.set(array[index], 1);
  13.       // push 进数组中
  14.       _arr.push(array[index]);
  15.     }
  16.   }
  17.   return _arr;
  18. }
  19. console.log(unqueArr6(arr)); // [1, 2, 6, 3, 5, 0, 8, 9, 4]

Array.from + Set

  1. var arr = [1, 1, 2, 6, 3, 5, 0, 3, 6, 8, 9, 4, 4, 2, 0, 9, 5, 2];
  3. function unqueArr6(array) {
  4.   // 利用 Set 不能唯一的特性
  5.   // 然后将 Set 转化成数组
  6.   return Array.from(new Set(array));
  7. }
  8. console.log(unqueArr6(arr)); // [1, 2, 6, 3, 5, 0, 8, 9, 4]