JavaScript 数组去除重复的方法有哪些

在处理JavaScript数组时，去除重复元素是一个常见的任务。可以使用多种方法达到这个目标，如：Set对象、filter结合indexOf、reduce、Map对象、第三方库（如Lodash）。其中，使用Set对象是一种简单而现代的方法，因为Set只能包含唯一的值，因此可以轻松地将一个数组转换成一个Set，再将Set转换回数组，以此来去除数组中的重复项。

一、使用SET对象

Set对象是ES6中引入的一种新的数据结构，用于存储唯一值。转换数组到Set并再转回数组是最现代和简洁的去重方法：

let uniqueArray = [...new Set(yourArray)];

详细描述：

在这种方法中，你首先通过传递数组yourArray给Set构造函数来创建一个新的Set对象，这个对象中只包含原数组的唯一值。然后，使用扩展运算符...将Set对象转换回数组，这样你就得到了一个去除了重复值的数组uniqueArray。

二、FILTER结合INDEXOF

filter()方法可以创建一个新数组，其包含通过所提供函数实现的测试的所有元素。结合indexOf()方法，可以轻松实现数组去重：

let uniqueArray = yourArray.filter((item, index) => {

    return yourArray.indexOf(item) === index;
});

详细描述：

filter()方法会遍历数组中的每个元素，并使用回调函数检查该元素。在这个回调函数中，使用indexOf()方法检查当前元素第一次出现的索引是否等于当前元素的索引。如果是，这意味着这个元素尚未在数组中出现过，因此它会被filter方法添加到新数组中。

三、使用REDUCE

reduce()方法对数组中的每个元素执行一个由您提供的“reducer”回调函数，结果输出为单个值。我们可以结合使用数组方法includes()，在reduce()中构建一个累加器数组，不断地将不重复的项加入这个累加器数组中：

let uniqueArray = yourArray.reduce((accumulator, currentValue) => {

    return accumulator.includes(currentValue) ? accumulator : [...accumulator, currentValue];
}, []);

详细描述：

reduce()方法中的回调函数接收两个参数：accumulator（累加器/上一次回调返回的值）和currentValue（数组中正在处理的当前元素）。使用includes()方法检查accumulator中是否已存在currentValue。如果不存在，则将currentValue添加到accumulator中。最后，reduce将累加器值输出，即新的无重复元素数组。

四、使用MAP对象

Map对象同样是ES6中引入的一种集合对象，可以存储键值对。可以利用Map的键是唯一的这一特性去除数组中的重复项：

let uniqueArray = Array.from(new Map(yourArray.map((item) => [item, item])).values());

详细描述：

这里通过将数组yourArray的每个元素映射成一个键值对数组，然后创建一个Map对象。由于Map的键不可以重复，因此只能包含每个元素的一个实例。之后，通过values()方法获取Map对象中的所有值，最后使用Array.from()将它们转换成一个新数组。

五、利用第三方库

对于不想手动处理去重或正在使用第三方库如Lodash的开发者，可以简单地调用库中提供的去重函数：

let uniqueArray = _.uniq(yourArray);

详细描述：

在这里，Lodash的uniq函数接收数组作为参数，并返回一个新的不含重复值的数组。Lodash库包含许多实用的功能，能够简化数组和对象等JavaScript数据结构的常见操作。

每种方法都有其适用的场景和优缺点。了解并正确选择使用场合，可以有效提高代码效率和可读性。

相关问答FAQs：

1. 如何使用 Set 去除 JavaScript 数组中的重复项？

Set 是 JavaScript 中的一个新数据结构，它允许你存储不重复的值。你可以通过将数组传递给 Set 构造函数来创建一个 Set，然后将其转换回数组。这将自动去除重复项。

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

2. 如何使用 reduce() 方法去除 JavaScript 数组中的重复项？

reduce() 方法可以将数组中的每个元素传递给一个回调函数，并将回调函数的返回值累加到结果中。我们可以使用 reduce() 方法来过滤掉重复项。

const arr = [1, 2, 2, 3, 4, 4, 5];
const uniqueArr = arr.reduce((accumulator, currentValue) => {
  if (!accumulator.includes(currentValue)) {
    accumulator.push(currentValue);
  }
  return accumulator;
}, []);

3. 如何使用 filter() 方法去除 JavaScript 数组中的重复项？

filter() 方法可以根据指定的条件过滤数组并返回新的数组。我们可以通过使用 filter() 方法来过滤掉重复项。

const arr = [1, 2, 2, 3, 4, 4, 5];
const uniqueArr = arr.filter((value, index, array) => {
  return array.indexOf(value) === index;
});

最后建议，企业在引入信息化系统初期，切记要合理有效地运用好工具，这样一来不仅可以让公司业务高效地运行，还能最大程度保证团队目标的达成。同时还能大幅缩短系统开发和部署的时间成本。特别是有特定需求功能需要定制化的企业，可以采用我们公司自研的企业级低代码平台：织信Informat。 织信平台基于数据模型优先的设计理念，提供大量标准化的组件，内置AI助手、组件设计器、自动化（图形化编程）、脚本、工作流引擎（BPMN2.0）、自定义API、表单设计器、权限、仪表盘等功能，能帮助企业构建高度复杂核心的数字化系统。如ERP、MES、CRM、PLM、SCM、WMS、项目管理、流程管理等多个应用场景，全面助力企业落地国产化/信息化/数字化转型战略目标。 版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们微信：Informat_5 处理，核实后本网站将在24小时内删除。