JavaScript数组去重全面总结：12种方法

"JavaScript数组去重的方法总结，包括12种不同的实现方式，适用于不同的场景和需求。这些方法包括利用ES6的Set、for循环嵌套for循环配合splice、indexOf、filter、reduce、Map等。文章旨在提供一个全面的参考，帮助开发者在面试或实际项目中解决数组去重的问题。虽然在实际开发中可能较少直接处理数组去重，但了解这些方法对于提升面试技巧和应对可能的需求是很有帮助的。" 以下是详细说明的12种JavaScript数组去重方法： 1. 利用ES6 Set去重 ```javascript function unique(arr) { return Array.from(new Set(arr)); } ``` ES6中的Set数据结构可以自动去除重复元素，将Set转换回数组即可得到去重后的结果。但这种方法不能去除重复的空对象`{}`。 2. 利用for嵌套for配合splice去重 ```javascript function unique(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; } ``` 这种方法通过比较数组中的相邻元素并移除重复项，但效率较低，不推荐用于大数据量的数组。 3. 利用indexOf去重 ```javascript function unique(arr) { return arr.filter(function(item, index) { return arr.indexOf(item) === index; }); } ``` 使用filter方法，如果当前元素在数组中的第一次出现位置等于当前位置，则保留该元素。 4. 利用filter与JSON.stringify去重 ```javascript function unique(arr) { return arr.filter(function(item, index, self) { return JSON.stringify(self) !== JSON.stringify([item].concat(self.slice(index + 1))); }); } ``` 对于包含复杂对象的数组，可以先将数组转换成字符串再进行比较，但性能较差且无法处理NaN。 5. 利用filter与includes去重 ```javascript function unique(arr) { return arr.filter((value, index, self) => self.includes(value) === index); } ``` includes方法检查数组是否包含指定元素，与indexOf类似。 6. 利用filter与map去重 ```javascript function unique(arr) { return arr.map(function(item, index) { return { item: item, index: index }; }).filter(function(obj, index, self) { return obj.index === self.findIndex(function(findObj) { return findObj.item === obj.item; }); }).map(function(obj) { return obj.item; }); } ``` 先创建一个包含原元素及其索引的对象数组，再过滤并返回元素。 7. 利用reduce去重 ```javascript function unique(arr) { return arr.reduce(function(acc, cur) { return acc.includes(cur) ? acc : [...acc, cur]; }, []); } ``` reduce方法遍历数组，如果当前元素不在累积器数组中，就添加进去。 8. 利用Set与Array.from去重 ```javascript function unique(arr) { return Array.from(new Set(arr), item => JSON.parse(JSON.stringify(item))); } ``` 结合Set和Array.from，同时处理复杂对象的去重，但效率较低。 9. 利用Map去重 ```javascript function unique(arr) { let map = new Map(); return arr.filter(item => !map.has(item) && map.set(item, 1)); } ``` 使用Map存储已出现过的元素，filter方法过滤掉已存在的元素。 10. 利用Object属性去重 ```javascript function unique(arr) { return arr.filter((item, index) => !obj[item] && (obj[item] = true)); } var obj = {}; ``` 使用对象属性作为标记，避免了引用类型的问题。 11. 利用双重filter去重 ```javascript function unique(arr) { return arr.filter(function(item, index) { return arr.filter(function(findItem) { return findItem === item; }).length === 1; }); } ``` 通过两次filter，确保每个元素在数组中只出现一次。 12. 利用Array.prototype.toString()去重 ```javascript function unique(arr) { return arr.filter(function(item, index, self) { return self.toString().indexOf(item) === index; }); } ``` 将数组转换为字符串，然后比较元素在字符串中的位置。 以上方法各有优缺点，根据实际需求选择合适的方法进行数组去重。在处理包含复杂对象或需要考虑性能的情况下，应谨慎选择。