zoukankan      html  css  js  c++  java
  • 数组去重

    在JavaScript中,数组常常被用到,自然数组去重在项目中就会经常碰到了,本文总结了一些常见的数组去重方法。

    ES6 Set去重

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>数组去重</title>
    </head>
    <body>
        <script>
            function unique(arr){
                return Array.from(new Set(arr))
            }
            var a = [1,2,,'tr',,'N','n',0,0,{},true,false,'true','false',false,
                    'false',NaN,'NaN',NaN,'NaN',undefined,'undefined',undefined,'undefined',
                    {},2,1,true];
            var b = unique(a);
            console.log(b);
            console.log(a);
        </script>    
    </body>
    </html>

    这种方法不会改变原数组,但是不能去掉重复的“{}”

    ES5中的splice

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>数组去重</title>
    </head>
    <body>
        <script>
            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;
            }
            var a = [1,2,,'tr',,'N','n',0,0,{},true,false,'true','false',false,
                    'false',NaN,'NaN',NaN,'NaN',undefined,'undefined',undefined,'undefined',
                    {},2,1,true];
            var b = unique(a);
            console.log(b);
            console.log(a);
        </script>    
    </body>
    </html>

    这种方法利用双层循环,外层循环元素,内层循环时比较值。值相同时,则删去这个值。在对数组进行去重的同时也改变了原数组,但是不能去掉NaN和{}。

    indexOf去重

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>数组去重</title>
    </head>
    <body>
        <script>
            function unique(arr){
                if(!Array.isArray(arr)){
                    console.log('type error')
                    return
                }
                var array = [];
                for(var i = 0; i <arr.length; i++){
                    if(array.indexOf(arr[i])== -1){
                        array.push(arr[i])
                    }
                }
                return array;
            }
            var a = [1,2,,'tr',,'N','n',0,0,{},true,false,'true','false',false,
                    'false',NaN,'NaN',NaN,'NaN',undefined,'undefined',undefined,'undefined',
                    {},2,1,true];
            var b = unique(a);
            console.log(b);
            console.log(a);
        </script>    
    </body>
    </html>

    新建一个空的结果数组,for 循环原数组,判断结果数组是否存在当前元素,如果有相同的值则跳过,不相同则push进数组。这种方法不会改变原数组,但是也不能去掉NaN和{}。

    sort()去重

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>数组去重</title>
    </head>
    <body>
        <script>
            function unique(arr){
                if(!Array.isArray(arr)){
                    console.log('type error')
                    return
                }
                arr = arr.sort();
                var array=[arr[0]];
                for(var i = 1; i < arr.length; i++){
                    if(arr[i] !== arr[i-1]){
                        array.push(arr[i]);
                    }
                }
                return array;
            }
            var a = [1,2,,'tr',,'N','n',0,0,{},true,false,'true','false',false,
                    'false',NaN,'NaN',NaN,'NaN',undefined,'undefined',undefined,'undefined',
                    {},2,1,true];
            var b = unique(a);
            console.log(b);
            console.log(a);
        </script>    
    </body>
    </html>

    新建一个空的结果数组,for 循环原数组,判断结果数组是否存在当前元素,如果有相同的值则跳过,不相同则push进数组。这种方法虽然没有改变原数组的数据项,但是改变了原有的顺序,所以依旧是改变了原数组,并且该方法不能去掉重复的NaN,{}和“NaN”。

    利用对象的属性不能相同的特点进行去重

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>数组去重</title>
    </head>
    <body>
        <script>
            function unique(arr){
                if(!Array.isArray(arr)){
                    console.log('type error')
                    return
                }
                var array = [];
                var obj ={};
                for(var i = 0; i< arr.length; i++){
                    if(!obj[arr[i]]){
                        array.push(arr[i])
                        obj[arr[i]] = 1;
                    }else{
                        obj[arr[i]]++
                    }
                }
                return array;
            }
            var a = [1,2,,'tr',,'N','n',0,0,{},true,false,'true','false',false,
                    'false',NaN,'NaN',NaN,'NaN',undefined,'undefined',undefined,'undefined',
                    {},2,1,true];
            var b = unique(a);
            console.log(b);
            console.log(a);
        </script>    
    </body>
    </html>

    这种方法也不会改变原数组,并且是去重最完整的方法,但是还去掉了一些并没有重复的数据,例如false和“false”,NaN和‘NaN’等。

    includes去重

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>数组去重</title>
    </head>
    <body>
        <script>
            function unique(arr){
                if(!Array.isArray(arr)){
                    console.log('type error')
                    return
                }
                var array = [];
                for(var i = 0; i < arr.length; i++){
                    if(!array.includes(arr[i])){
                        array.push(arr[i]);
                    }
                }
                return array;
            }
            var a = [1,2,,'tr',,'N','n',0,0,{},true,false,'true','false',false,
                    'false',NaN,'NaN',NaN,'NaN',undefined,'undefined',undefined,'undefined',
                    {},2,1,true];
            var b = unique(a);
            console.log(b);
            console.log(a);
        </script>    
    </body>
    </html>

    这种方法不会改变原数组,但是不能去掉重复的{}

    filter去重

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>数组去重</title>
    </head>
    <body>
        <script>
            function unique(arr){
                return arr.filter(function(item,index,arr){
                    return arr.indexOf(item,0) == index;
                })
            }
            var a = [1,2,,'tr',,'N','n',0,0,{},true,false,'true','false',false,
                    'false',NaN,'NaN',NaN,'NaN',undefined,'undefined',undefined,'undefined',
                    {},2,1,true];
            var b = unique(a);
            console.log(b);
            console.log(a);
        </script>    
    </body>
    </html>

    递归去重

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>数组去重</title>
    </head>
    <body>
        <script>
            function unique(arr){
                var array = arr;
                var len = array.length;
                array.sort(function(a,b){
                    return a - b;
                })
                function loop(index){
                    if(index >= 1){
                        if(array[index] === array[index -1]){
                            array.splice(index,1);
                        }
                        loop(index - 1);
                    }
                }
                loop(len - 1);
                return array;
            }
            var a = [1,2,,'tr',,'N','n',0,0,{},true,false,'true','false',false,
                    'false',NaN,'NaN',NaN,'NaN',undefined,'undefined',undefined,'undefined',
                    {},2,1,true];
            var b = unique(a);
            console.log(b);
            console.log(a);
        </script>    
    </body>
    </html>

  • 相关阅读:
    use paramiko to connect remote server and execute command
    protect golang source code
    adjust jedi vim to python2 and python3
    install vim plugin local file offline
    add swap file if you only have 1G RAM
    datatables hyperlink in td
    django rest framework custom json format
    【JAVA基础】网络编程
    【JAVA基础】多线程
    【JAVA基础】String类的概述和使用
  • 原文地址:https://www.cnblogs.com/yuyujuan/p/9782179.html
Copyright © 2011-2022 走看看