返回

去重术大法:掌握十一种数组去重神功,让数据焕发新机!

前端

去重,顾名思义,就是要让数据独一无二,杜绝重复项的出现。在程序开发中,数组去重尤为重要,它能大大提高数据处理的效率和准确性。今天,我们就来解锁十一种数组去重神功,助你轻松搞定数据去重难题!

一、Set大法

Set是一种数据结构,其特点就是不能包含重复元素。因此,我们可以直接将数组元素放入Set中,再将其展开为新的数组,即可得到去重后的结果。

const arr = [1, 2, 3, 1, 2, 4];
const uniqueArr = [...new Set(arr)];
console.log(uniqueArr); // [1, 2, 3, 4]

二、Array.from大法

Array.from方法可以将类似数组的对象或可迭代对象转换为真正的数组。我们可以利用它的这个特性,将Set对象转换为数组,从而实现去重。

const arr = [1, 2, 3, 1, 2, 4];
const uniqueArr = Array.from(new Set(arr));
console.log(uniqueArr); // [1, 2, 3, 4]

三、filter大法

filter方法可以根据给定的条件过滤数组中的元素,并返回一个包含满足条件元素的新数组。我们可以利用这一点,通过indexOf或lastIndexOf方法来判断元素是否重复,从而实现去重。

const arr = [1, 2, 3, 1, 2, 4];
const uniqueArr = arr.filter((item, index) => arr.indexOf(item) === index);
console.log(uniqueArr); // [1, 2, 3, 4]

四、indexOf大法

indexOf方法可以返回一个元素在数组中首次出现的位置。我们可以利用它来判断元素是否重复,从而实现去重。

const arr = [1, 2, 3, 1, 2, 4];
const uniqueArr = [];
for (let i = 0; i < arr.length; i++) {
  if (arr.indexOf(arr[i]) === i) {
    uniqueArr.push(arr[i]);
  }
}
console.log(uniqueArr); // [1, 2, 3, 4]

五、lastIndexOf大法

lastIndexOf方法与indexOf方法类似,但是它返回一个元素在数组中最后出现的位置。我们可以利用它来判断元素是否重复,从而实现去重。

const arr = [1, 2, 3, 1, 2, 4];
const uniqueArr = [];
for (let i = 0; i < arr.length; i++) {
  if (arr.lastIndexOf(arr[i]) === i) {
    uniqueArr.push(arr[i]);
  }
}
console.log(uniqueArr); // [1, 2, 3, 4]

六、includes大法

includes方法可以判断一个元素是否包含在数组中。我们可以利用它来判断元素是否重复,从而实现去重。

const arr = [1, 2, 3, 1, 2, 4];
const uniqueArr = [];
for (let i = 0; i < arr.length; i++) {
  if (!uniqueArr.includes(arr[i])) {
    uniqueArr.push(arr[i]);
  }
}
console.log(uniqueArr); // [1, 2, 3, 4]

七、reduce大法

reduce方法可以将数组中的元素逐个累积,并返回一个最终结果。我们可以利用它来实现数组去重。

const arr = [1, 2, 3, 1, 2, 4];
const uniqueArr = arr.reduce((prev, curr) => {
  return prev.includes(curr) ? prev : [...prev, curr];
}, []);
console.log(uniqueArr); // [1, 2, 3, 4]

八、Map大法

Map是一种数据结构,它允许键值对。我们可以利用它的键唯一性的特点来实现数组去重。

const arr = [1, 2, 3, 1, 2, 4];
const uniqueArr = [...new Map(arr.map((item) => [item, null])).keys()];
console.log(uniqueArr); // [1, 2, 3, 4]

九、Object.keys大法

Object.keys方法可以获取对象的所有键。我们可以利用它的这个特性,将数组元素作为对象的键,从而实现去重。

const arr = [1, 2, 3, 1, 2, 4];
const uniqueArr = Object.keys({...arr});
console.log(uniqueArr); // [1, 2, 3, 4]

十、Object.values大法

Object.values方法可以获取对象的所有值。我们可以利用它的这个特性,将数组元素作为对象的键,从而实现去重。

const arr = [1, 2, 3, 1, 2, 4];
const uniqueArr = Object.values({...arr});
console.log(uniqueArr); // [1, 2, 3, 4]

十一、Array.prototype.unique大法

ES6中新增了Array.prototype.unique方法,它可以对数组进行去重。

const arr = [1, 2, 3, 1, 2, 4];
const uniqueArr = arr.unique();
console.log(uniqueArr); // [1, 2, 3, 4]

总结

以上就是十一种数组去重的常用方法。每种方法都有其优缺点,大家可以根据实际情况选择最适合自己的方法。希望这些方法能帮助大家在数据处理中游刃有余,让数据焕发新机!