js数组去重多种方法详解

最新推荐文章于 2024-07-15 14:11:16 发布
最新推荐文章于 2024-07-15 14:11:16 发布
阅读量32 收藏 1
点赞数 1
分类专栏： js 数组去重 文章标签： javascript 前端 es6
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/xifengqingye/article/details/130937062
版权

以下方法均对此数组做出操作，为了代码统一性，CV都懒得

var arr = [1, 2, 3, 1, 2, 3, 4, 1, 2, 3, 4, 5, 1, 2, 3, 4, 5, 6, 1, 2, 3, 4, 5, 6, 7];

数组去重是学习js中很重要的一部分，培养你的逻辑思维和一丢丢的算法能力，更是对数组方法的一次锻炼，在面试中也常常用到，简单有，有难度的也有，看个人能力能记个六七种便已是比我强好多的大佬了，鉴于本人很懒，不再做陈述，直接上图片:

 

 

 

 

 

 

 

 

 

 以上就是对于数组去重我个人的认知啦，首次发文，希望像我一样的小白能够多敲几次锻炼一下思路，数组方法在未来的前端框架中经常用到，熟悉他们并记牢他们就可以迈出前端的一小小小步了，你学废了嘛~

xifengqingye
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
js数组去重的方法
qq_43919485的博客
08-20 694
方案1 1、利用数组的filter方法去重 var arr = [1,2,8,9,5,8,4,0,4]; function unique( arr ){ return arr.filter(function(item,index){ return arr.indexOf(item,0) === index; });
js数组对象去重的几种方式
今天鸭鸭不想出去玩
04-23 224
let arr = [{name:1},{name:2},{name:3},{name:4},{name:3,love:2},{name:2},{name:1}]; const unit = (arr)=>{ return arr.reduce((m,o)=>{m.set(o.name,o);return m;},new Map()); } let o2 = []; for(let [k,v] of map=unit(arr)){ o2.push(v) } console.
【JavaScript】数组去重的方法详解
浅陌繁星的博客
12-26 333
步骤：先将数组进行排序将排序后的数组进行相邻之间的比较，判断他们是否相同 该方法缺点：步骤：直接对原数组进行遍历从前往后查找，判断是否存在一样的数字 注：虽然该方法不会改变原数组的排序，但是会修改原数组。步骤：首先创建一个新的空数组然后判断原数组中的数据在新数组中是否存在 注：该方法创建了新数组，既没有改变原数组，也没有修改原数组的排序。(1) 首先先简单介绍以下Set1.Set 数据结构的特点：2.Set 数据结构的语法： (2) 实现的数组去重的代码： 注：以上两行代码输出的结果是Set格式的，如果想转
js数组去重（9种方法），你都会了吗？
热门推荐
前端菜鸟好先森的博客
12-03 7万+
九种数组去重的方式和详解（包含对象数组去重）
Javascript 数组去重的方法（四种）详解及实例代码
11-28
本文将详细介绍四种不同的JavaScript数组去重方法，并提供相应的实例代码。 **第一种方法：基于`indexOf`的去重** 这种方法利用`Array.prototype.indexOf()`方法来检查元素是否已经在新数组`n`中出现过。如果...
详解javascript数组去重问题
11-22
总结来说，JavaScript数组去重有多种方法，包括基础的双层循环、利用`indexOf()`、基于索引比较以及利用额外数据结构。每种方法都有其适用场景，开发者应根据实际需求选择合适的方法。对于性能和内存的权衡，可以...
js构建二叉树进行数值数组的去重与优化详解
10-18
主要给大家介绍了关于js构建二叉树进行数值数组的去重与优化的相关资料，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧。
vue2 实现原生 WebSocket
weixin_38797742的博客
07-11 410
原生WebSocket： new WebSocket。
vue 自定义滚动条同步拖动（移动端）
u014206461的博客
07-12 189
vue 自定义滚动条同步拖动（移动端）
vue快速上手——创建vue项目，vue基本使用方式，路由vue-Router，转态管理vuex
最新发布
weixin_73582152的博客
07-15 261
Node.js 是一个开源、跨平台的 JavaScript 运行时环境，它允许开发者在服务器端运行 JavaScript 代码。Node.js 是基于 Chrome V8 引擎构建的，它的设计目标是提供一种高效、轻量级的方式来构建可扩展的网络应用程序。事件驱动：Node.js 使用非阻塞 I/O 模型，使其非常适合处理大量并发连接，这使得它在构建实时应用程序（如聊天应用）时非常高效。单线程。
在项目中，如何使用springboot+vue+springsecurity+redis缓存+Axios+MySQL数据库+mybatis
huanghm88的专栏
07-11 701
在Spring Boot中，可以使用Spring Data JPA和MyBatis来配置MySQL数据库。在Vue项目中，可以创建一个config.js文件来配置后端的API地址，然后在需要发送请求的地方使用Axios发送请求。根据业务需求，在Spring Boot中编写相应的接口和服务层代码，包括数据访问、业务逻辑等。在Vue中，可以使用Axios发送HTTP请求，并将响应的数据展示在前端页面上。分别启动后端的Spring Boot应用和前端的Vue应用，访问前端页面，就可以看到与后端进行通信的效果。
vue引入sm-crypto通过sm4对文件进行加解密，用户输入密码
cc1314_工作、学习有感
07-12 273
通过sm4对文件进行加解密，用户输入密码
Vue单路由的独享守卫怎么设置
ggq53219的博客
07-13 180
在Vue.js中，特别是在使用Vue Router时，路由守卫（Route Guards）是一种强大的机制，允许我们在路由发生变化时执行一些逻辑，比如检查用户是否登录、加载数据等。Vue Router提供了全局守卫、路由独享守卫和组件内守卫三种类型的守卫。对于你的问题，关于如何设置“单路由的独享守卫”（即路由独享守卫），你可以通过给特定的路由配置。当尝试进入这个路由时，会首先调用这个守卫函数。如果检查未通过（即用户未登录），则调用。函数是一个假设的示例，你需要根据你的应用逻辑来实现它。
前端 JS 经典：迭代器
weixin_64684095的博客
07-12 207
如果在最后一个值返回后再调用 next()方法，那么返回的对象中属性 done 的值为 true，属性 value 则包含迭代器最终返回的值（如果没有相关数据则返回 undefined）。可迭代对象具有 Symbol.iterator 属性，通过指定的函数可以返回一个作用于附属对象的迭代器。JavaScript 中有一些内置的可迭代对象，如数组、字符串、集合（Set）、映射（Map）等，它们都具有默认的迭代器。在 JavaScript 中，迭代器是一个对象，它定义了一个序列，并在终止时可能返回一个返回值。
Vue3 使用 Vue Router 时，prams 传参失效和报错问题
专注基础架构领域
07-12 496
我尝试使用 prams 传递数据当我跳转页面时,得到的 prams 数据为空 ,控制台也出现了 Vue Router 的警告点开链接后发现了原因,。也就是说，从Vue Router的2022-8-22 这次更新后，我们使用上面的方式在新页面无法获取：vue也给我们提出了解决方案：使用 query 的方式传参只要改成query 传参就好了,注意query传参只能用路由表中的 path ,不是 name ,并且所有参数都会显示在URL 地址上。将参数放在 pinia 或 vuex仓库里。
js中scrollIntoView第一次不生效，第二次生效
风如也的博客
07-12 170
方法用于将元素滚动到可视区域。如果在页面加载后立即使用，可能不会生效，因为页面可能还没有完全渲染或者加载完成。如果是因为元素还没有完全渲染完成，可以在。关键是确保在页面完全加载和渲染之后再调用。
React:useState和useEffect
读万卷书 行万里路
07-12 489
最近因为想要开发一个简单的应用才开始接触React。但是并没有系统学习React，所以这篇博客可能会写的不够专业。
基于JAVA+SpringBoot+Vue+Echarts的充电数据大屏可视化分析
azhou的代码园
07-12 612
随着电动汽车的普及，城市中充电设施的需求日益增长。为了提高充电设施的管理效率和用户体验，本文提出了一个停车场充电桩数据可视化平台的设计与实现。该平台旨在集成、处理并展示来自多个充电桩的实时数据，帮助管理者进行有效监控和决策支持，同时为车主提供便捷、直观的充电信息查询服务。首先，本研究分析了现代停车场充电桩管理的业务需求，确定了平台的主要功能模块，包括管理员登录，数据源excel导入、数据清洗、大屏数据展示、以及不同维度数据分析图表展示等。
every方法 数组去重
08-29
使用every方法可以实现数组去重。下面是一个示例代码： ```javascript function deduplicationArray(arr) { let target = []; arr.forEach(item => { target.every(x => x !== item) && target.push(item); }); return target; } ``` 这个函数接受一个数组作为参数，然后利用forEach方法遍历数组中的每一个元素。在遍历过程中，使用every方法判断目标数组中是否已经存在当前元素，如果不存在则将其添加进目标数组。最后返回目标数组，即为去重后的数组。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* [reduce详解和多种用法，可下载直接使用](https://download.csdn.net/download/weixin_39519297/86773412)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"] - *2* [JS数组去重的8种代码实现](https://blog.csdn.net/weixin_41650390/article/details/109211387)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"] - *3* [数组循环方法以及数组去重总结](https://blog.csdn.net/weixin_43848576/article/details/122717528)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"] [ .reference_list ]

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值