美文网首页
JavaScript数组去重的几种方法

JavaScript数组去重的几种方法

作者: 苏敏 | 来源:发表于2017-11-01 22:20 被阅读5次
    贴入代码前 ,先对浏览器Array对象进行支持indexOf和forEach的polyfill
    Array.prototype.indexOf = Array.prototype.indexOf || function(item) {
        for (var i = 0, j = this.length; i < j; i++) {
            if (this[i] === item) {
                return i;
            }
        }
        return -1;
    }
    
    Array.prototype.forEach = Array.prototype.forEach || function(callback, thisArg) {
        if (!callback || typeof callback !== 'function') return;
    
        for (var i = 0, j = this.length; i < j; i++) {
            callback.call(thisArg, this[i], i, this);
        }
    }
    

    一个方法,遍历数组,建立新数组,利用indexOf判断是否存在于新数组中,不存在则push到新数组,最后返回新数组

    Array.prototype.deleteRepeat = function(){
         var arr = [];
         for (var i =0;i<this.length;i++) {         //遍历数组
          if (arr.indexOf(this[i]) == -1) {
            arr.push(this[i]);                      //是否在新数组中查找到元素,没有则返回-1,push此元素
        }
        }
              return arr;
    }
    //关于Array.prototype.xxx()和直接调用方法的区别我有单独写了
    
    console.log([2,4,2,3,4].deleteRepeat());
    

    思路:

    1、构建一个新数组,新数组包含一个元素,元素值为目标数组的一个值;
    2、从目标数组的第二个元素开始遍历,依次取出每一个元素;
    3、将取出的元素与新数组里面的所有元素进行比较,如果没有出现,则将该元素添加到新数组中,如果出现,则处理下一个目标数组的元素。

    也可以用forEach来代替:

    Array.prototype.deleteRepeat = function(){
         var arr = [];
         this.forEach(function(index){        //遍历数组
          if (arr.indexOf(index) == -1) {
            arr.push(index);                      //是否在新数组中查找到元素,没有则返回-1,push此元素
        }
        });
              return arr;
    }
    //在IE9+以下并不支持forEach函数;可以重写forEach 函数实现兼容
    console.log([2,4,2,3,4].deleteRepeat());
    

    利用数组的reduce方法,对数组中的每一个元素进行处理

    Array.prototype.deleteRepeat=function (){
            // 通过数组的reduce方法,对数组中的每一个元素进行处理,原理都一样,只是使用了不同的方法
            return this.reduce(function(arr,index){
                if(arr.indexOf(index)<0){
                    arr.push(index);
                }
                return arr;
            },[]);
        }
    console.log([2,4,2,3,4].deleteRepeat());
    

    使用filter方法

    Array.prototype.deleteRepeat=function (){
            var arr=[];
            arr=this.filter(function(element,i,arrs) {
                return arrs.indexOf(element) === i;
            });
            return arr;
        }
    console.log([2,4,2,3,4].deleteRepeat());
    

    使用箭头函数(ES6语法)

        //箭头函数
        function deleteRepeat(arr){
            const seen=new Map(){
                return arr.filter((a)=>!seen.has(a)&&seen.set(a,1));
            }
        }
        //Array.form
        function deleteRepeat2(arr){
            return Array.form(new Set(arr))
        }
    

    相关文章

      网友评论

          本文标题:JavaScript数组去重的几种方法

          本文链接:https://www.haomeiwen.com/subject/sydnpxtx.html