JavaScript数组去重方案

目录
  • 方法一:set :不是一种数据类型,是一种数据结构;成员唯一
  • 方法二:对象属性名不能重复
  • 方法三:indexOf
  • 方法四:sort
  • 方法五:includes :包含;如果数组包含那一项,返回true;不包含返回false;
  • 方法六:hasOwnProperty : 检测属性名是否是对象的一个私有属性;返回一个布尔值;
  • 方法七:filter+indexOf
  • 方法八:splice
  • 方法九:递归
  • 方法十:Map :利用了Map数据结构存值的特点;
  • 方法十一:reduce
  • 方法十二:类似于方法一的set,用了剩余运算符...

还有其他可以处理数组的几个方法~
- includes:方法用来判断一个数组是否包含一个指定的值,根据情况,如果包含则返回 true,否则返回false。
- find:返回第一次找到的那一项
- some:返回一个布尔值,只要一个是true,就返回true
- every:返回一个布尔值,需要每一项都是true,才返回true
- filter:返回一个过滤后的新数组;如果返回true就留下,false就过滤掉
- reduce:收敛

下面我们进入正题~(希望能对你有帮助~小编有点皮!!哈哈哈哈哈哈)

方法一:set :不是一种数据类型,是一种数据结构;成员唯一

let arr = [12,1,12,3,1,88,66,9,66];
function unique(ary) {
        let s  = new Set(ary);
        // Array.from : 将set数据结构转成真正的数组;
        return  Array.from(s)
    }
    unique(arr);

方法二:对象属性名不能重复

let arr = [12,1,12,3,1,88,66,9,66];
function unique(ary) {
        let obj = {};
        for(let i=0;i<ary.length;i++){
            let cur = ary[i];
            if(obj[cur]){
                //ary.splice(i,1);// 导致数组塌陷
                ary[i]=ary[ary.length-1];
                ary.length--;// 删除最后一项
                i--;
                continue;
            }
            obj[cur]=cur;// 给obj新增键值对;属性名和属性值是一样的
        }
    }
    unique(arr);

方法三:indexOf

let arr = [12,1,12,3,1,88,66,9,66];
 function unique(ary) {
        let newAry = [];
        for(let i=0;i<ary.length;i++){
            let  cur = ary[i];
            if(newAry.indexOf(cur)===-1){
                newAry.push(cur);
            }
        }
        return newAry;
    }
    unique(arr)

方法四:sort

let arr = [12,1,12,3,1,88,66,9,66];
function unique(ary) {
       let a = ary.sort(function (a,b) {
           return a-b;
       });
       for(let i=0;i<a.length;i++){
           if(a[i]===a[i+1]){
               a.splice(i+1,1);
               i--;
           }
       }
       return a;
   }
   unique(arr)

方法五:includes :包含;如果数组包含那一项,返回true;不包含返回false;

let arr = [12,1,12,3,1,88,66,9,66];
function unique(ary) {
        let newAry = [];
        let len = ary.length;
        for(let i=0;i<len;i++){
            let cur = ary[i];
            if(!newAry.includes(cur)){
                newAry.push(cur);
            }
        }
        return newAry;
    }
    console.log(unique(arr));

方法六:hasOwnProperty : 检测属性名是否是对象的一个私有属性;返回一个布尔值;

let arr = [12,1,12,3,1,88,66,9,66];
function unique(ary) {
        let obj = {};
        return ary.filter(function (item,index,a) {
            // item : 数组每一个成员
            // index: 成员对应的索引
            // a : 整个数组
            // hasOwnProperty来校验的该属性是否出现过;
           return  obj.hasOwnProperty(typeof item+item)?false:obj[typeof item+item]=true;
           if(obj.hasOwnProperty(typeof item+item)){
               return false
           }else{
               obj[typeof item+item]=true;
               return true;
           }
        })
    }
    console.log(unique(arr))

方法七:filter+indexOf

let arr = [12,1,12,3,1,88,66,9,66];
    function unique(ary) {
        return ary.filter(function (item,index,a) {
            return ary.indexOf(item)===index;
        })
    }
    console.log(unique(arr));

方法八:splice

let arr = [12,1,12,3,1,88,66,9,66];
 function unique(ary) {
        for(let i=0;i<ary.length;i++){
            for(j=i+1;j<ary.length;j++){
                if(ary[i]===ary[j]){
                    ary.splice(j,1);
                    j--;
                }
            }
        }
        return ary;
    }
    unique(arr);

方法九:递归

let arr = [12,1,12,3,1,88,66,9,66];
function unique(ary) {
        let  len= ary.length;
        ary = ary.sort(function (a,b) {
            return a-b;
        });
        function loop(index) {
            if(index>=1){
                if(ary[index]===ary[index-1]){
                    ary.splice(index,1);
                }
                loop(index-1)
            }
        }
        loop(len-1);
        return ary;
    }
    console.log(unique(arr));

方法十:Map :利用了Map数据结构存值的特点;

let arr = [12,1,12,3,1,88,66,9,66];
function unique(ary) {
        let newAry =[];
        let map = new Map();
        for(let i=0;i<ary.length;i++){
            if(!map.has(ary[i])){
                map.set(ary[i],true);
                newAry.push(ary[i]);
            }
        }
    }
    unique(arr);

方法十一:reduce

let arr = [12,1,12,3,1,88,66,9,66];
function unique(ary) {
        // reduce : 第一个是函数,第二个参数会传给第一次回调的prev;
        return ary.reduce((prev,next)=>{
            // 该函数返回值是下一次执行的prev;
            return prev.includes(next)?prev:[...prev,next];
        },[])
    }
    console.log(unique(arr));

方法十二:类似于方法一的set,用了剩余运算符...

let  arr = [12,1,12,3,1,88,66,9,66];
    let a = [...new Set(arr)];
    console.log(a);

到此这篇关于JS数组方案的文章就介绍到这了,更多相关JS数组去重内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

(0)

相关推荐

  • JavaScript 数组去重详解

    目录 1.数组去重 2.数组去重里面的对象去重 3.根据数组某个字段相同,修改另外字段值 总结 1.数组去重 /********************************************** ╚description: ╚作者: 麒麟社 ╚时间: 2021-09-13 22:26:21 ╚名称: V1.0.5 ***********************************************/ var obj = ['麒麟','社','CC','DD','麒麟','社'

  • JavaScript中数组去重的5种方法

    正常情况下,数据去重的工作一般都是由后端同事来完成的,但是前端也要掌握好处理数据的能力,万一去重的工作交给我们大前端处理,我们也不能怂呀.现在我总结了一些去重的方法,希望对大家有点帮助. 方法一:new Set()实现数组去重 ES6 提供了新的数据结构 Set,它类似于数组,但是成员的值都是唯一的,没有重复的值. Set 本身是一个构造函数,用来生成 Set 数据结构.Set函数可以接受一个数组,用于初始化.根据 Set的数据特性,我们可以实现数组去重. let list = [1, 1, '

  • js数组去重的11种方法

    在实际工作或面试中,我们经常会遇到"数组去重"问题,接下来就是使用js实现的数组去重的多种方法: 1.将数组的每一个元素依次与其他元素做比较,发现重复元素,删除 var arr = [1,23,1,1,1,3,23,5,6,7,9,9,8,5,5,5,5]; console.log(arr); //[1, 23, 1, 1, 1, 3, 23, 5, 6, 7, 9, 9, 8, 5, 5, 5, 5] function noRepeat1(arr) { for(var i = 0;

  • javascript数组常见操作方法实例总结【连接、添加、删除、去重、排序等】

    本文实例讲述了javascript数组常见操作方法.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>www.jb51.net 数组的方法</title> <script> var arr=[1,3,4] var arr1=["a",&quo

  • JavaScript常用数组去重实战源码

    数组去重,一般都是在面试的时候才会碰到,一般是要求手写数组去重方法的代码.如果是被提问到,数组去重的方法有哪些?你能答出其中的10种,面试官很有可能对你刮目相看. 在真实的项目中碰到的数组去重,一般都是后台去处理,很少让前端处理数组去重.虽然日常项目用到的概率比较低,但还是需要了解一下,以防面试的时候可能回被问到. 1.利用对象的属性 使用对象属性不重名的特性. var arr = ['qiang','ming','tao','li','liang','you','qiang','tao'];

  • 关于JavaScript数组去重的一些理解汇总

    前言 做前端开发几年,在项目中用到数组去重的机会倒不是很多,但是在面试的时候却经常被问到,个人理解,这道题真正考的是对JavaScript的基础的掌握,因为有很多种方式可以做到.这次就根据这道题,将相关的知识理解透彻. 一.ES6中的new Set方式 先看看MDN上对Set的描述: Set 对象允许你存储任何类型的唯一值,无论是原始值或者是对象引用. Set对象是值的集合,你可以按照插入的顺序迭代它的元素. Set中的元素只会出现一次,即 Set 中的元素是唯一的. 关键字:任何类型都可以存储

  • js将多维数组转为一维数组后去重排序

    目录 先说一下多维数组拍平 方法一: flat() 方法二: 用空字符串拼接再用split()分割一下 方法三: toString() 方法四: join() 方法五:递归调用 方法六:使用reduce 数组去重 方法一:创建一个新数组,判断新数组中是否存在该元素如果不存在则将此元素添加到新数组中 方法二:使用Set大法 方法三:使用filter() 数组排序 方法一:使用sort() 整理几个方法,怕后面忘记了又要到处翻笔记 先说一下多维数组拍平 方法一: flat() // 比如说这里有一个

  • Javascript数组去重的几种方法详解

    目录 数组去重 1 双层for循环(类似冒泡排序的双层循环写法) 2 循环和indexof.循环和includes 3 利用对象属性不能重复去重 4 ES6 Set 5 ES6 Array. prototype.filter() 6 ES6 Array. prototype.reduce() 总结 数组去重 1 双层for循环(类似冒泡排序的双层循环写法) var arr = [2,3,4,2,34,21,1,12,3,4,1] for(var i =0;i<arr.length;i++){ /

  • JavaScript数组去重方案

    目录 方法一:set :不是一种数据类型,是一种数据结构:成员唯一 方法二:对象属性名不能重复 方法三:indexOf 方法四:sort 方法五:includes :包含:如果数组包含那一项,返回true:不包含返回false: 方法六:hasOwnProperty : 检测属性名是否是对象的一个私有属性;返回一个布尔值: 方法七:filter+indexOf 方法八:splice 方法九:递归 方法十:Map :利用了Map数据结构存值的特点: 方法十一:reduce 方法十二:类似于方法一的

  • 详解javascript数组去重问题

    首先,我想到的是另建一个结果数组,用来存储原始数组中不重复的数据.遍历原始数组依次跟结果数组中的元素进行比较,检测是否重复.于是乎,我写出了如下代码A: Array.prototype.clearRepetitionA = function(){ var result = []; var isRepetition; for(var i=0; i<this.length; i++){ isRepetition = false; for(var j=0; j<result.length; j++)

  • javascript数组去重方法分析

    本文实例讲述了javascript数组去重方法.分享给大家供大家参考,具体如下: 方法一. 思路:创建一个新的空数组,循环遍历旧数组,用indexOf()方法,可以取得元素在数组中的位置,如果值为-1表示不存在.那么新数组用indexOf去获取老数组的每一个元素,如果值为-1表示不存在,就把他push到新数组里,最后输出新数组即去重后的数组 var arr=[24,56,74,89,24,56,78,09,24]; var new_arr=[]; for(var i=0;i<arr.length

  • javascript数组去重常用方法实例分析

    本文实例讲述了javascript数组去重常用方法.分享给大家供大家参考,具体如下: 数组去除重复值是面试常考内容,也是很容易用到的一个技巧,下面就几种去重的方法进行介绍. 首先是最常见的方法,也就是添加一个临时数组,将原数组遍历,加入临时数组,每次加入时判断待加入的元素是否存在于临时数组中,代码如下: // 对数组进行去重操作,只考虑数组中元素为数字或字符串,返回一个去重后的数组 //第一种方法,遍历,将没有的插入临时数组 function uniqArray1(arr) { var n=[]

  • JavaScript数组去重的多种方法(四种)

    数组去重,一般需求是给你一个数组,调用去重方法,返回数值副本,副本中没有重复元素.一般来说,两个元素通过 === 比较返回 true 的视为相同元素,需要去重,所以,1 和 "1" 是不同的元素,1 和 new Number(1) 是不同的元素,{} 和 {} 是不同的元素(引用不同).(当然如果需求认为 {} 和 {} 算作相同的元素,那么解法就不一样了) method 1 使用两重循环 function unique(arr) { var res = []; for(var i =

  • JavaScript数组去重由慢到快由繁到简(优化篇)

    在进行数组操作时往往会遇到去掉重复项的问题,下面简单介绍下数组去重的方法. indexOf去重 Array.prototype.unique1 = function() { var arr = []; for (var i = 0; i < this.length; i++) { var item = this[i]; if (arr.indexOf(item) === -1) { arr.push(item); } } return arr; } [1,2,3,'4',3,4,3,1,'34'

  • JavaScript数组去重的两种方法推荐

    1.数组去重: Array类型并没有提供去重复的方法,如果要把数组的重复元素干掉,那得自己想办法: 方法一:利用indexOf方法: var aa=[1,3,5,4,3,3,1,4] function arr(arr) { var result=[] for(var i=0; i<arr.length; i++){ if(result.indexOf(arr[i])==-1){ result.push(arr[i]) } } console.log(result) } arr(aa) 方法二:

  • javascript数组去重方法汇总

    javascript数组去重方法汇总 Array.prototype.unique1 = function () { var n = []; //一个新的临时数组 for (var i = 0; i < this.length; i++) //遍历当前数组 { //如果当前数组的第i已经保存进了临时数组,那么跳过, //否则把当前项push到临时数组里面 if (n.indexOf(this[i]) == -1) n.push(this[i]); } return n; }; Array.pro

  • JavaScript数组去重的五种方法

    javascript数组去重是一个比较常见的需求,解决方法也有很多种,网上都可以找到答案的,下面小编给大家整理了一份关于同类型的数组去重的方法,先给大家介绍下简单实现思路. 思路: 遍历数组,一一比较,比较到相同的就删除后面的 遍历数组,一一比较,比较到相同的,跳过前面重复的,不相同的放入新数组 任取一个数组元素放入新数组,遍历剩下的数组元素任取一个,与新数组的元素一一比较,如果有不同的,放入新数组. 遍历数组,取一个元素,作为对象的属性,判断属性是否存在 1. 删除后面重复的: functio

  • Javascript 数组去重的方法(四种)详解及实例代码

     Javascript 数组去重的四种方法 四种算法来实现这个目的: 第一种方法: Array.prototype.unique1 = function () { var n = []; //一个新的临时数组 for (var i = 0; i < this.length; i++) //遍历当前数组 { //如果当前数组的第i已经保存进了临时数组,那么跳过, //否则把当前项push到临时数组里面 if (n.indexOf(this[i]) == -1) n.push(this[i]); }

随机推荐