盘点JS中数组去重写法
在JavaScript编程中，处理数组去重是一项常见的任务。当我们需要从一个数组中去除重复的元素时，有多种方法可以实现。下面将盘点几种常见的数组去重写法。
1. 使用Set数据结构
Set数据结构是ES6中新增的一种集合类型，它只会存储不重复的值。我们可以通过将数组转换为Set来实现数组去重。
let arr = [1, 2, 3, 4, 3, 2, 1];
let uniqueArr = Array.from(new Set(arr));
console.log(uniqueArr); // [1, 2, 3, 4]
以上代码首先使用new Set()将数组arr转换为Set对象，然后再通过Array.from()方法将Set对象转换为数组，这样就得到了去重后的数组。
2. 使用indexOf方法
另一种常见的数组去重方法是遍历原数组，将每个元素与新数组中的元素进行比较，如果新数组中不存在该元素，则将其添加到新数组中。
let arr = [1, 2, 3, 4, 3, 2, 1];
let uniqueArr = [];
for (let i = 0; i < arr.length; i++) {
if (uniqueArr.indexOf(arr[i]) === -1) {
uniqueArr.push(arr[i]);
}
}
console.log(uniqueArr); // [1, 2, 3, 4]
以上代码我们使用indexOf方法判断新数组uniqueArr中是否已经存在当前元素，如果不存在则将其添加到新数组中。
3. 使用includes方法
ES7中新增了includes方法，该方法可以更方便地判断数组中是否包含某个元素。我们可以利用这个特性来实现数组去重。
let arr = [1, 2, 3, 4, 3, 2, 1];
let 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]
上述代码中，我们使用includes方法判断新数组uniqueArr中是否已经存在当前元素，如果不存在则将其添加到新数组中。
4. 利用 for of 循环和 includes 方法
这种方法与上一个方法类似，但使用了 for...of 循环，可读性更强。
let arr = [1, 2, 2, 3, 4, 4, 5];
let uniqueArr = [];
for (let value of arr) {
if (!uniqueArr.includes(value)) {
uniqueArr.push(value);
}
}
5. 使用filter方法
filter方法是数组的一个高阶函数，可以根据指定的条件筛选出符合条件的元素并返回一个新数组。我们可以利用这个方法来实现数组去重。
let arr = [1, 2, 3, 4, 3, 2, 1];
let uniqueArr = arr.filter((value, index, self) => {
return self.indexOf(value) === index;
});
console.log(uniqueArr); // [1, 2, 3, 4]
通过filter方法遍历数组arr，并使用indexOf方法判断当前元素在数组中的第一个索引位置，如果与当前索引相等，则保留该元素。
6.利用 Map 数据结构
Map 数据结构也可用于去重，它允许使用任何类型作为键（键可以是重复的），并自动删除所有重复的键。在此例中我们可以将数组元素作为 Map 的键，这样重复的键会被自动删除。然后我们再通过 Array.from() 方法将 Map 对象转回数组。这种方法与第一种方法类似，但无需使用额外的 Set 数据结构。
let arr = [1, 2, 2, 3, 4, 4, 5];
let uniqueArr = Array.from(new Map(arr.map(x => [x, true]))).map(x => x[0]);
7.使用 findIndex 方法
与indexOf类似，使用findIndex函数可以在数组中查找元素的索引，如果找到重复的元素，其索引值会大于首次出现的索引值。因此，可以遍历数组，当findIndex返回的索引值大于当前索引时，说明该元素是重复的，可以过滤掉。
let array = [1, 2, 2, 3, 4, 4, 5];
let uniqueArray = [];
for (let i = 0; i < array.length; i++) {
if (array.findIndex(value => value === array[i]) === i) {
uniqueArray.push(array[i]);
}
}
console.log(uniqueArray); // 输出: [1, 2, 3, 4, 5]
8.使用递归去重
removeDuplicates 函数接受一个数组作为参数。它使用一个辅助函数 recursiveCheck，该函数使用递归的方式遍历原始数组并将非重复元素添加到结果数组中。result.includes(arr[index]) 这行代码用于检查结果数组中是否已经包含当前元素，如果不包含则将其添加到结果数组中（这里也可以换做其他方法查询是否包含当前元素）。
function removeDuplicates(arr) {
// 创建一个新数组来存储去重后的结果
var result = [];
// 递归函数，用于遍历原始数组并添加非重复元素到结果数组中
function recursiveCheck(index) {
if (index >= arr.length) {
return; // 递归结束条件：遍历完原始数组
}
if (!result.includes(arr[index])) {
result.push(arr[index]); // 将非重复元素添加到结果数组
}
recursiveCheck(index + 1); // 递归调用，处理下一个元素
}
recursiveCheck(0); // 从索引 0 开始递归检查
return result;
}
var array = [1, 2, 3, 2, 4, 3, 5];
var uniqueArray = removeDuplicates(array);
console.log(uniqueArray); // 输出 [1, 2, 3, 4, 5]
该例子中的去重算法时间复杂度为O(n^2)，在处理大量数据时可能不够高效。如果对性能要求较高，可以考虑其他算法。
9.使用 hasOwnProperty 方法去重
使用 hasOwnProperty 方法结合一个空对象来判断数组元素是否重复，可以实现数组去重。
我们创建一个空对象 result，用于存储去重后的结果。然后，我们遍历原始数组 arr，对于每个元素，我们使用 hasOwnProperty 检查它是否已经存在于 result 对象中，如果不存在，则将其添加到 result 数组中。
function removeDuplicates(arr) {
var result = [];
for (var i = 0; i < arr.length; i++) {
if (!result.hasOwnProperty(arr[i])) {
result.push(arr[i]);
}
}
return result;
}
var array = [1, 2, 3, 2, 4, 3, 5];
var uniqueArray = removeDuplicates(array);
console.log(uniqueArray); // 输出 [1, 2, 3, 4, 5]
总结
以上我们介绍了几种常见的数组去重方法，包括使用Set数据结构、indexOf方法、hasOwnProperty方法、includes方法和filter方法等。实际开发过程中，要根据实际情况选择适合的方法可以有效地去除数组中的重复元素，提高代码的性能和可读性。
关注公众号👇👇👇免费体验AI小工具，内置多种场景👇👇
最后不要忘了点个赞再走噢