记录--数组去重的五种方法

news2024/12/23 13:04:16

这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助

前言

您或许会疑惑,网上那么多去重方法,这篇文章还有什么意义?

别着急,这篇文章只节选了简单的,好玩的,古老的,有实际讲解意义的去重方法,除了去重的实现以外,我还将和您分享这其中的其他细节和拓展

您或许不理解,为什么只有五种?

当然,我可以举例出更多的例子来,但那有什么意义呢?工作中用不到那么多,会其中一二就可以。即使是面试,能说出五种也是完全足够的。所以,我们完全没有必要去记忆更多的去重方式。

五种方式

最简单的方法,ES6的Set去重(最推荐)

这个方法是我日常开发中最喜欢用的方法,因为,他的使用方法是所有去重中最简单的。而我是一个懒癌患者。

new Set是ES6新推出的一种类型。他和数组的区别在于,Set类型中的数据不可以有重复的值。当然,数组的一些方法Set也无法调用。

使用方法:其实很简单,将一个数组转化为Set数据,再转化回来,就完成了去重。

    const arr = [1,1,2,2,3,3,4,4,5,5];
    const setData = Array.from(new Set(arr));
    console.log(setData);

图例↓

但是Set去重有一个弊端,他无法去重引用类型的数据。比如对象数组。

图例:

所以如果您的数组中都是值类型的数据(比如全string或者全number),那么使用Set进行去重一定是首选,会为您减少很多的麻烦。

最古老的方法,双重for循环去重

在很早以前,还没有Set,没有map,filter的时候,双重for循环几乎是去重的唯一方式。

//双重循环去重
const handleRemoveRepeat = (arr) => {
    for (let i=0,len = arr.length; i < len; i++) {
        for (let j = i + 1; j < len; j++) {
            if (arr[i] === arr[j]) {
                arr.splice(j, 1);
                j--;
                len--;
            }
        }
    }
    return arr;
};

图例:

这里有一个有意思的地方,或许您不太明白,为什么我的for循环的初始表达式中声明了两个东西:let i = 0;len = arr.length;

我来给您解答:

被圈起来的三个表示的是for循环的三个表达式,依次分别是:初始表达式判断表达式自增表达式。其中,初始表达式在for循环开始的时候会执行一次,以后就不会再执行了,但是判断表达式自增表达式会在每一次循环的时候都去执行。

如果您不太理解文字表达,没关系,我画了张图。

 

您或许已经发现,后一个圈中的内容会陷入一个循环。

但这和我们一开始len = arr.length有什么关系呢?

值得注意的是,如果一开始定义,那么每一次循环,都需要走 arr.length,length可是个方法,虽然他的消耗并不大,但在for循环中这个消耗会被方法,假设这个循环需要循环10000次呢,length就会被执行10000次。

最鸡肋的去重方式,indexOf去重

indexOf还是相对简单又鸡肋。为什么说他鸡肋呢?说难吧,indexOf方法确实比上文的双重for循环简单。说简单吧,嘿,他没Set方法去重来的更简单。所以鸡肋。

//去重
const handleRemoveRepeat = (arr) => {
    let repeatArr = [];
    for (let i = 0,len = arr.length ; i < len; i++) 
     if (repeatArr.indexOf(arr[i]) === -1)  repeatArr.push(arr[i])
    return repeatArr;
}

 图例:

同样的,这个方法也有一个细节点,您或许已经发现了,上文的if和for没有花括号;是的;for和if都默认对下面一条语句负责。在没有必要的情况下,不用多加一个{}。

或许您会觉得这不可读,这就是有意思的地方了,这是一个工具类方法,注定被藏在utils中的一个方法,他无关业务逻辑,并不需要有太大可读性。

而且,这么写还有一个很原因:给人的视觉冲击会比较大。说点人话就是 -----很装逼;

一种类似于indexOf的去重方法,includes去重

使用includes的去重方法和indexOf不能说很像,基本上一模一样。变换的仅仅只是判断方法。

includes的判断方法更简单了。循环数组的每一样,用新数组检测当前数组中是否包含数组项,如果不包含,则追加该元素

const handleRemoveRepeat = (arr) => {
    let repeatArr = [];
    for (let i = 0,len = arr.length ; i < len; i++)
        if (!repeatArr.includes(arr[i])) repeatArr.push(arr[i])
    return repeatArr;
}

图例

includes方法在除了去重以外的场景,还是很好用的。

最有趣的去重方法,使用filter去重。

使用filter配合indexOf进行的去重过程,真的可以非常的简单且富含趣味性。

//去重
const handleRemoveRepeat = (arr) => arr.filter((item,index) => arr.indexOf(item,0) === index);

是的,没了,就一行。

图例

您是否没有反应过来?乍一看,不知道他是怎么完成去重的。

小问题,我为您解答疑惑。

indexOf的特性是返回被查找的目标中包含的第一个位置的索引

如图,下标为0和下标为4的位置存储的都是“1”。但是indexOf()只返回了0。因为indexOf的特性是返回被查找的目标中包含的第一个位置的索引。

同样的,我们可以利用这个特性。来完成去重,文字描述恐怕很难表达准确,您可以看看下面的这张图。

 

您或许会问:如果要去重对象数组怎么办?

去除对象数组的方式他并不是很稳定,这不像我们去重值类型数据的数组,上面的五种方法随便复制一种,往里面一调用就好了。绝对不会出问题。

但是对象数组去重,需要有一个去重条件,也就是根据哪个字段进行去重。

用双重循环去重举个例子:

 图例

如上图,我们就是拿数据的id作为去重条件的。

像这样的对象数组就不能直接提供方法,因为每一个场景下的对象数组都不一定一样。我这是根据id去重,万一其他地方需要根据其他字段去重呢。

所以,如果您需要去重对象,根据上方的截图中的代码。使用双重for循环的方法,自己自定义一个可以满足您当前业务需求的去重方法。

本文转载于:

https://juejin.cn/post/7152759573978284040

如果对您有所帮助,欢迎您点个关注,我会定时更新技术文档,大家一起讨论学习,一起进步。

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/344337.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

内网渗透(二十四)之Windows协议认证和密码抓取-Mimikatz读取sam和lsass获取密码

系列文章第一章节之基础知识篇 内网渗透(一)之基础知识-内网渗透介绍和概述 内网渗透(二)之基础知识-工作组介绍 内网渗透(三)之基础知识-域环境的介绍和优点 内网渗透(四)之基础知识-搭建域环境 内网渗透(五)之基础知识-Active Directory活动目录介绍和使用 内网渗透(六)之基…

ILSSI国际研讨会将为您呈现六西格玛技术的未来与前景

ILSSI 欢迎世界各地的精益六西格玛专业人士参加即将举行的2023年国际精益六西格玛研讨会&#xff0c;这次研讨会将邀请到世界各地的专家学者&#xff0c;分享他们的专业知识和经验&#xff0c;并就精益六西格玛等相关议题进行探讨和交流。 这是一个绝佳的机会&#xff0c;让您…

Hudi-集成Flink

文章目录集成Flink环境准备sql-client方式启动sql-client插入数据查询数据更新数据流式插入code 方式环境准备代码类型映射核心参数设置去重参数并发参数压缩参数文件大小Hadoop参数内存优化读取方式流读&#xff08;Streaming Query&#xff09;增量读取&#xff08;Increment…

MongoDB简介入门docker安装MongDB,Spring集成MongDB

一、MongoDB简介1、NoSQL简介NoSQL(NoSQL Not Only SQL)&#xff0c;意即反SQL运动&#xff0c;指的是非关系型的数据库&#xff0c;是一项全新的数据库革命性运动&#xff0c;早期就有人提出&#xff0c;发展至2009年趋势越发高涨。NoSQL的拥护者们提倡运用非关系型的数据存储…

【C++初阶】十一、STL---priority_queue(总)

目录 一、priority_queue介绍 二、priority_queue使用 三、仿函数 四、priority_queue模拟实现 4.1 版本1 4.2 版本2 一、priority_queue介绍 priority_queue文档介绍 翻译; &#xff08;1&#xff09;优先队列是一种容器适配器&#xff0c;根据严格的弱排序标准&#x…

微服务网关(五)grpc代理模块

微服务网关&#xff08;五&#xff09;grpc代理模块 GRPC是谷歌出品的一个高性能、开源、通用的RPC框架&#xff0c;基于HTTP/2标准设计&#xff0c;支持普通RPC也支持双向流式传递&#xff0c;相对于thrift连接&#xff0c;它可以多路复用&#xff0c;可传递header头数据 在…

Ubuntu20.04 安装Azure Kinect Sensor

本文主要记录Ubuntu20.04 安装Azure Kinect Sensor SDKAzure Kinect 人体跟踪 SDK官网&#xff1a;https://learn.microsoft.com/zh-cn/azure/Kinect-dk/body-sdk-downloadLinux版本目前只支持18.04和20.04Azure Kinect 传感器 SDK 官网&#xff1a;https://learn.microsoft.co…

ubuntu20.04下配置深度学习环境GPU

卸载子系统 C:\Users\thzn>wsl --list 适用于 Linux 的 Windows 子系统分发版: docker-desktop (默认) docker-desktop-data Ubuntu-18.04 Ubuntu-22.04 Ubuntu-20.04 C:\Users\thzn>wsl --unregister Ubuntu-18.04 ubuntu 换源 https://www.cnblogs.com/Horizon-asd/p…

【编程基础之Python】4、安装Python开发工具

【编程基础之Python】4、安装Python开发工具安装Python开发工具为什么需要开发工具Anaconda自带的开发工具PyCharm安装PyCharm运行PyCharm并创建项目总结安装Python开发工具 为什么需要开发工具 通常情况下&#xff0c;为了提高开发效率&#xff0c;需要使用相应的开发工具&a…

Three.js 无限平面快速教程【Plane】

Three.js 提供了 Plane 概念来表示在 3d 空间中无限延伸的二维表面。 这对于光标交互很有用&#xff0c;因此你可能需要了解如何设置此平面、将其可视化并根据需要进行调整。 推荐&#xff1a;使用 NSDT场景设计器 快速搭建 3D场景。 Three.js 的 Plane 文档很好而且准确&…

Locust初次体验【解决webUI没数据】

官方文档&#xff1a;What is Locust? — Locust 2.14.2 documentation webUI模式跑起来没有数据。。。。&#xff1f;&#xff1f;&#xff1f;&#xff1b; E:\T_Work\other\WB_Locust\my_locustfiles>locust [2023-02-14 09:57:44,530] PC-20190108TSZQ/INFO/locust.m…

Java 基础面试题——基本数据类型与包装类

目录1.Java 有哪几种基本数据类型&#xff1f;分别对应哪些包装类&#xff1f;2.Java 中为什么要保留基本数据类型&#xff1f;为什么要使用包装类&#xff1f;3.基本数据类型的转换规则有哪些&#xff1f;4.基本数据类型与包装类有什么区别&#xff1f;5.什么是装箱&#xff1…

MongoDB--》索引的了解及具体操作

目录 索引—index 索引的类型 索引的管理操作 索引的使用 索引—index 使用索引的原因&#xff1a;索引支持在MongoDB中高效地执行查询。如果没有索引&#xff0c;MongoDB必须执行全集合扫描&#xff0c;即扫描集合中的每个文档&#xff0c;以选择与查询语句匹配的文档。这…

基于android的即时通讯APP 聊天APP

基于android的即时通讯APP 或者 聊天APP 一 项目概述 该项目是基于Android 的聊天APP系统&#xff0c;该APP包含前台&#xff0c;后台管理系统&#xff0c;前台包含用户通讯录,用户详情&#xff0c;用户聊天服务&#xff0c;用户二维码,发现功能,发现详情 , 个人中心, 个人信…

【RSTP的原理和配置】

一、RSTP 概述 RSTP使用了IEEE 802.1W协议&#xff0c;视为STP的改进版本&#xff0c;收敛速度快&#xff0c;兼容STP。 RSTP可以兼容STP&#xff0c;但是会丧失快速收敛等优势&#xff1b; 1、RSTP对STP的改进&#xff1b; 1.1、端口角色的增补、简化了生成树协议的理解及部…

【基于transform和CNN的多级蒸馏:超分】

A hybrid of transformer and CNN for efficient single image super-resolution via multi-level distillation &#xff08;基于transform和CNN的多级蒸馏单幅图像超分辨率算法&#xff09; 近年来&#xff0c;基于卷积神经网络&#xff08;CNN&#xff09;的单幅图像超分辨…

Boost库的编译

废话就不多说了&#xff0c;直接上boost编译的方法。 1、下载boost库源码 https://github.com/missionlove/boost 2、使用vs命令行工具&#xff0c;选择对应的Command工具 3、切换目录到Boost源码 bootstrap.bat 文件所在的目录下 4、运行bootstrap.bat 脚本 start bootst…

CSS单位之vw、vh、vmin、vmax、%

CSS单位之vw、vh、vmin、vmax、% vm/vh&#xff1a;相对于视窗&#xff08;Viewport&#xff09;的高度和宽度。 1vh 等于1/100的视窗高度&#xff0c;1vw 等于1/100的视窗宽度。 视窗(Viewport)是指浏览器内部的可视区域大小&#xff0c;即window.innerWidth/window.innerHei…

研报精选230213

目录 【行业230213西南证券】医疗创新器械-内窥镜行业专题&#xff1a;核心三问&#xff0c;内窥镜技术趋势图谱和投资机会【行业230213国金证券】基础化工行业研究&#xff1a;成长接力&#xff0c;继续看好有边际变化的新材料【行业230213民生证券】有色金属周报&#xff1a;…

Hazel游戏引擎(004)

本人菜鸟&#xff0c;文中若有代码、术语等错误&#xff0c;欢迎指正 我写的项目地址&#xff1a;https://github.com/liujianjie/GameEngineLightWeight&#xff08;中文的注释适合中国人的你&#xff09; 文章目录前言操作步骤讲解GitHubHazel项目此项目定位项目属性修改Sand…