JavaScript中数组去重的方法

Js中数组去重方法众多，这里给大家提供几种解决思路。
以var arr=[1,2,3,4,5,4,3,2,1,1,1];作为测试用例。

方法1：(写一个用作判断是否包含的函数)

1. 创建一个新的数组new_arr。
2. 遍历arr数组，将arr数组中的元素一个个放入new_arr中。
3. 在放入的过程中，判断new_arr中是否已经包含了这个元素。
4. 如果不包含，则放入。
5. 返回new_arr。

首先需要创建一个函数，用作判断数组中是否包含元素。

function has(arr,data){ 
        for(var i=0;i<arr.length;i++){
            if(arr[i] === data){  // 如果数组中包含这个元素
                return true;
            }
        }
        return false; 
    }

然后封装数组去重的函数：

function arrNoRepeat(arr){
        var new_arr = [];    //创建新数组
        for(var i=0;i<arr.length;i++){
            var contains = has(new_arr, arr[i]);  
            if(!contains){   //如果新数组中不包含这个元素
                new_arr.push(arr[i]);   //添加到新数组末尾
            }
        }
        return new_arr;
    }
    var arr = [1,2,3,4,5,4,3,2,1,1,1];
    var res = arrNoRepeat(arr);
    console.log(res);
    function has(myarr,data){ 
        for(var i=0;i<myarr.length;i++){
            if(myarr[i] === data){  //如果数组中包含这个元素
                return true;
            }
        }
        return false; 
    }

控制台的打印结果为：[1,2,3,4,5]。

方法2：(双层循环)

1. 创建一个新的数组new_arr。
2. 利用循环的嵌套，数组第0位依次和后面的数做比较。
3. 比较结果相同，就跳出内层循环。
4. 如果比较结果不同，则push()到new_arr中
5. 返回new_arr

function arrNoRepeat(arr){
        var new_arr = [];   // 创建新数组
        var isRepeat;   
        for(var i=0;i<arr.length;i++){  //外层循环
            isRepeat = false;
            for(var j=i+1;j<arr.length;j++){ 
                if(arr[i] === arr[j]){   // 判断是否相等
                    isRepeat = true;
                    break;
                }
            }
            if(!isRepeat){
                new_arr.push(arr[i]);
            }  
        }
        return new_arr;
    }
    var arr = [1,2,3,4,5,4,3,2,1,1,1];
    var res = arrNoRepeat(arr);
    console.log(res);

控制台的打印结果为：[5,4,3,2,1]。

方法3：(双层循环)

1. 创建一个新的数组new_arr。
2. 利用循环的嵌套，数组第0位依次和后面的数做比较。
3. 如果比较结果相同，外层循环i=i+1;内层循环j=j+1。
4. 如果不是重复元素，则push()到new_arr中。
5. 返回new_arr。

function arrNoRepeat(arr){
    var new_arr = [];   // 创建新数组  
    for(var i=0;i<arr.length;i++){  //外层循环
        for(var j=i+1;j<arr.length;j++){ 
            if(arr[i] === arr[j]){   // 判断是否相等
                j = ++i;   //j=++i等同于j=j+1;i=i+1;
            }
        }
        new_arr.push(arr[i]);
    }
    return new_arr;
}
var arr = [1,2,3,4,5,4,3,2,1,1,1];
var res = arrNoRepeat(arr);
console.log(res);

控制台的打印结果为：[5,4,3,2,1]。

方法4：(先进行排序，后比较相邻元素)

1. 创建一个新的数组new_arr。
2. 将arr进行排序。
3. 遍历数组，比较相邻元素。
4. 如果不相等，则push()到new_arr中
5. 返回new_arr;

   function arrNoRepeat(arr){
        var new_arr = [];   // 创建新数组  
        arr.sort();     //排序
        for(var i=0;i<arr.length;i++){
            if(arr[i] !== arr[i+1]){   //如果相邻元素不等
                new_arr.push(arr[i]);  
            }
        }
        return new_arr;
    }
    var arr = [1,2,3,4,5,4,3,2,1,1,1];
    var res = arrNoRepeat(arr);
    console.log(res);

控制台的打印结果为：[1,2,3,4,5]。

方法5：(利用对象的key不可重复来去重)

1. 创建一个新的数组new_arr。
2. 创建一个对象。
3. 判断对象的key是否重复。
4. 不重复则push()到new_arr中。
5. 返回new_arr。

function arrNoRepeat(arr){
    var new_arr = [];   // 创建新数组  
    var obj = {};  //创建新对象
    for(var i=0;i<arr.length;i++){
        if(!obj[arr[i]]){    // 如果obj[arr[i]]和其他key不重复
            obj[arr[i]] = 1;    //赋值
            new_arr.push(arr[i]);   
        }
    }
    return new_arr;
}
var arr = [1,2,3,4,5,4,3,2,1,1,1];
var res = arrNoRepeat(arr);
console.log(res);

控制台的打印结果为：[1,2,3,4,5]。

注意：这种方法会出现如下几个问题：

1. 无法区分隐式类型转换成字符后值一样的数，比如1和”1”;
2. 无法处理复杂类型比如对象(对象作为key会变成[object Object])。

以上是数组去重的五种方法，每一个都有它独特的优缺点，不知道你平时使用的是哪一种呢，或者你更倾向于哪一种，数组去重一定还有其他方法，欢迎大家补充~武汉加油，中国加油，逆战必胜!