数组去重的常用的五种方法（ES6, indexOf，双重for循环）

最新推荐文章于 2023-08-08 10:45:39 发布

唐宋丶元明清

最新推荐文章于 2023-08-08 10:45:39 发布

阅读量2.7k

点赞数 3

文章标签： javascript 前端算法 es6

本文链接：https://blog.youkuaiyun.com/weixin_42989966/article/details/103513898

版权

本文介绍了五种在JavaScript中实现数组元素去重的方法，包括使用ES6的Set，indexOf，filter，双重for循环以及sort结合去重。每种方法都有详细的代码示例，适合不同场景下的需求。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

数组去重的常用的五种方法

方法1：利用ES6新增方法去重


// 方法1   利用ES6进行数组去重
        var arr1 = ['a', 'a', 1, 2, 3, 3, 4, 4, 4, 6];
        var arr1 = new Set(arr);
        console.log(arr1);
        console.log(Array.from(arr1)); ["a", 1, 2, 3, 4, 6]

方法2: 利用indexOf去重


        var arr2 = ['h', 'e', 'l', 'l', 'o', '2', 1, 2, 1, 3, 2];
        function noRepeat1(arr) {
            var newArr = [];

            for (var i = 0; i < arr.length; i++) {
                if (newArr.indexOf(arr[i]) == -1) {
                    newArr.push(arr[i]);
                }
            }

            return newArr;
        }
        var result2 = noRepeat1(arr2);
        console.log(result2);  // [ "h", "e", "l", "o", "2", 1, 2, 3 ]

方法3: 利用filter去重与方法2类似


 var arr3 = ['h', 'e', 'l', 'l', 'o', '2', 1, 2, 1, 3, 2];
       function noRepeat3(arr) {
            var newArr = [];
            newArr = arr.filter(function (item, index, array) {
             //利用下标 先得出原数组元素中的索引再与下标进行匹配  
             //相等则返回true 添加到新数组newArr中 当循环出相同元素不会与下标相同 返回false忽略
                return array.indexOf(item) == index; 
            });

            return newArr;
        }
        var result3 = noRepeat3(arr2);
        console.log(result3);  // [ "h", "e", "l", "o", "2", 1, 2, 3 ]

方法4: 利用双重for循环去重


var arr = ['h', 'e', 'l', 'l','l', 'o', '2', 1, 2, 1,1, 3, 2];
        function noRepeat4(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);
                        //因为从arr中删除了一个元素所以跳过了第i个元素后一个元素 所以要进行j-- 将下标减一
                        j--;
                    }
                }
            }
            return arr;
        }

        var result4 = noRepeat4(arr);

        console.log(result4);   //[ "h", "e", "l", "o", "2", 1, 2, 3 ]

方法5: 利用sort方法去除相邻重复元素但是会改变原数组的排序


 var arr5 = ['h', 'e', 'l', 'l','l', 'o', '2', 1, 2, 1,1, 3, 2];
        // var arr6 = ['h', 'e', 'l', 'l',3];
        function noRepeat5(arr){
            arr.sort();
            var newArr = [];
            for(var i=0; i<arr.length; i++){
                console.log('循环了'+i+'次')
              if(arr[i] !== arr[i+1]){
                 newArr.push(arr[i]);
              }  
            }
            return newArr;
        }
        var result5 = noRepeat5(arr5);

        console.log(result5);  [1, "2", 2, 3, "e", "h", "l", "o"]