如何从 JavaScript 数组中删除重复元素？

有多种方法可以删除数组中的重复项。我们将讨论最常见的四种方式。

使用filter() 方法： filter() 方法创建一个新的元素数组，这些元素通过我们提供的条件。它将仅包括那些返回 true 的元素。我们可以通过简单地调整我们的条件来从数组中删除重复值。

Javascript

    var arr = ["apple", "mango", "apple", 
            "orange", "mango", "mango"];
  
    function removeDuplicates(arr) {
        return arr.filter((item, 
            index) => arr.indexOf(item) === index);
    }
  
    console.log(removeDuplicates(arr));

输出：

["apple", "mango", "orange"]

使用Set()方法：此方法使用 ES6 (ES2015) 设置新的对象类型，允许您创建唯一值的集合。

Javascript

    var arr = ["apple", "mango", "apple",
            "orange", "mango", "mango"];
  
    function removeDuplicates(arr) {
        return [...new Set(arr)];
    }
  
    console.log(removeDuplicates(arr));

输出：

["apple", "mango", "orange"]

使用forEach() 方法：通过使用 forEach() 方法，我们可以遍历数组中的元素，如果数组中不存在新数组，我们将推入新数组。

Javascript

    var arr = ["apple", "mango", 
        "apple", "orange", "mango", "mango"];
  
    function removeDuplicates(arr) {
        var unique = [];
        arr.forEach(element => {
            if (!unique.includes(element)) {
                unique.push(element);
            }
        });
        return unique;
    }
  
    console.log(removeDuplicates(arr));

输出：

["apple", "mango", "orange"]

使用reduce() 方法： reduce() 方法用于减少数组的元素，并根据您传递的一些reducer函数将它们组合成最终数组。

Javascript

    var arr = ["apple", "mango", 
        "apple", "orange", "mango", "mango"];
  
    function removeDuplicates(arr) {
        var unique = arr.reduce(function (acc, curr) {
            if (!acc.includes(curr))
                acc.push(curr);
            return acc;
        }, []);
        return unique;
    }
  
    console.log(removeDuplicates(arr));

输出：

["apple", "mango", "orange"]