首页 > 其他分享 > JS实现数组去重(重复的元素只保留一个)

JS实现数组去重(重复的元素只保留一个)

时间:2022-11-09 15:00:55浏览次数:42  
标签:arr hash 重复 JS length 数组 var return

JS实现数组去重(重复的元素只保留一个)

1.遍历数组法

它是最简单的数组去重方法(indexOf方法)

实现思路:新建一个数组,遍历去要重的数组,当值不在新数组的时候(indexOf为-1)就加入该新数组中;

var arr=[2,8,5,0,5,2,6,7,2];
function unique1(arr){
  var hash=[];
  for (var i = 0; i < arr.length; i++) {
     if(hash.indexOf(arr[i])==-1){
      hash.push(arr[i]);
     }
  }
  return hash;
}

2.数组下标判断法

调用indexOf方法,性能和方法1差不多

实现思路:如果当前数组的第 i 项在当前数组中第一次出现的位置不是 i,那么表示第 i 项是重复的,忽略掉。否则存入结果数组。

function unique2(arr){
  var hash=[];
  for (var i = 0; i < arr.length; i++) {
     if(arr.indexOf(arr[i])==i){
      hash.push(arr[i]);
     }
  }
  return hash;
}

3.排序后相邻去除法

实现思路:给传入的数组排序,排序后相同的值会相邻,然后遍历排序后数组时,新数组只加入不与前一值重复的值。

function unique3(arr){
  arr.sort();
  var hash=[arr[0]];
  for (var i = 1; i < arr.length; i++) {
     if(arr[i]!=hash[hash.length-1]){
      hash.push(arr[i]);
     }
  }
  return hash;
}

4.优化遍历数组法(推荐)

实现思路:双层循环,外循环表示从0到arr.length,内循环表示从i+1到arr.length

将没重复的右边值放入新数组。(检测到有重复值时终止当前循环同时进入外层循环的下一轮判断)

function unique4(arr){
  var hash=[];
  for (var i = 0; i < arr.length; i++) {
    for (var j = i+1; j < arr.length; j++) {
      if(arr[i]===arr[j]){
        ++i;
      }
    }
      hash.push(arr[i]);
  }
  return hash;
}

5.ES6实现

基本思路:ES6提供了新的数据结构Set。它类似于数组,但是成员的值都是唯一的,没有重复的值。

Set函数可以接受一个数组(或类似数组的对象)作为参数,用来初始化。

function unique5(arr){
  var x = new Set(arr);
 return [...x];
}

扩展:如果重复,则去掉该元素

数组下标去重

function unique22(arr){
  var hash=[];
  for (var i = 0; i < arr.length; i++) {
     if(arr.indexOf(arr[i])==arr.lastIndexOf(arr[i])){
      hash.push(arr[i]);
     }
  }
  return hash;
}
var newArr = arr.reduce(function (prev, cur) {
    prev.indexOf(cur) === -1 && prev.push(cur);
    return prev;
},[]);

标签:arr,hash,重复,JS,length,数组,var,return
From: https://www.cnblogs.com/lifan-fineDay/p/16873689.html

相关文章

  • js 动态更新option
    varsel=document.getElementById("MsgTmpId");$("#TmpId").find("option").remove();$.each(data.Data,function(index,......
  • 直播平台怎么搭建,Android与Js互调之传递图片
    直播平台怎么搭建,Android与Js互调之传递图片添加addJavascriptInterface注解方法H5VerificationJavascriptInterface对象映射 publicclassH5VerificationJavascrip......
  • 返回Json时多了一对中括号,关于可变参数和简单问题思考
    今天写接口返回JSON数据时,遇到一个问题,是这样的,下面是代码示例,基于SpringDataJPA一、自己封装的ResultBean,用于接收数据,响应给前端packagetonels.common;importlombok.D......
  • 泛型的类型擦除后,fastjson反序列化时如何还原?
    铺垫我们选择​​fastjson​​来进行反序列化的测试,在测试前先定义一个实体类:@DatapublicclassFoo<T>{privateStringval;privateTobj;}如果大家对泛型的类型......
  • uniapp+pixijs写的一个转盘
    1,turntable.vue文件,这个里面显示菜单的时候,上一行文字还不能消除,我已经在研究了,等我搞好了我会更新这里的。后期等我多研究研究pixijs,我会出一些pixijs的文章。<template......
  • threejs三维地图大屏项目分享
    这是最近公司的一个项目。客户的需求是基于总公司和子公司的数据,开发一个数据展示大屏。大屏两边都是一些图表展示数据,中间部分是一个三维中国地图,点击中国地图的某个省份......
  • PyQt5 QTabWidget设置为侧边栏并且文字水平显示 --可能是最好的方法(完美支持QT设计器
    效果预览:使用之前(直接截的设计器里面的图:使用之后效果:教程:1,QT设计器部分:打开QT设计器,选择已经放入的TabWidget选择提升为:然后输入下面内容,点击添加和提升:2,py部......
  • 动态给v-for循环的数组绑定class
    效果图: 思路:通过:class来和三元运算符来动态绑定给v-for绑定一个单击事件,这个单击事件里传输下标索引,用于获取用户点击的是哪一个定义一个n来存储传过......
  • js线程机制与事件机制
    基于尚硅谷的尚硅谷JavaScript高级教程提供笔记撰写,加入一些个人理解github源码博客下载线程与进程进程程序的一次执行,它占有一片独有的内存空间可以通过windows......
  • js中的类和constructor
    问题一直搞不清constructor和super是干什么用的。前提了解js的继承原型继承原型继承是通过利用js的原型链functionPeople(name,age){this.name=name;this......