封装函数：数组对象中去除相同ID的项、递归找到所在ID的所有父级元素

最新推荐文章于 2023-01-04 12:58:13 发布
最新推荐文章于 2023-01-04 12:58:13 发布
阅读量2.1k 收藏 3
点赞数 2
分类专栏： Vue JavaScript 文章标签： 递归找到所有父级 去重
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/w1418899532/article/details/102924258
版权
本文介绍了项目开发中遇到的两个需求：一是处理数组对象，去除具有相同ID的项，以避免数据显示重复；二是通过递归方法找到指定ID在树形结构中的所有父级元素。详细讲解了利用filter、findIndex和find方法去重，并展示了递归函数的实现过程。
摘要由CSDN通过智能技术生成

记录下项目开发中遇到的两个实际需求。

1.数组对象中去除相同ID的项

从后台接口拿到的数据格式是数组对象，但是会存在前后调用同一个接口数据项重复的现象。导致页面中数据显示有重复的。所以在从接口取到数据以后，去除数组中有相同项的对象。

比如我从接口拿到的数据如下：

list: [
   {
    mapcode: 7, name: '快鱼', price: 2 },
   {
    mapcode: 8, name: '海澜之家', price: 2 },
   {
    mapcode: 9, name: '森马', price: 2 },
   {
    mapcode: 13, name: '华为mate10', price:
最低0.47元/天 解锁文章
tomorrownan
关注
专栏目录
JS 数组去重复数据、处理数组数据
一号斑马
05-21 1038
需求： 用*打印出，星号金字塔 // 星号金字塔 function text(num) { for (let i = 1; i <= num; i++) { let str = "" for (let j = 0; j <= num + i - 1; j++) { if (j <= num - i) { str += ' ' } else {
根据ID 数组中重复对象删除
sinat_36017053的博客
03-25 293
var obj = {} var temp = this.chooseSupplier.concat(val) this.chooseSupplier = temp.reduce((cur, next) => { obj[next.id] ? '' : obj[next.id] = true && cur.push(next) return cur }, [])```
数组去重--根据ID去除数组中重复的数据
领悟
02-14 693
根据ID去除数组中重复的数据
js 数组id去重
最新发布
weixin_35757531的博客
01-04 373
可以用下面的方法来去除数组中的重复项： 先将数组转换为 Set 类型，然后再转回数组。这种方法的缺点是会丢失原数组的顺序。 const arr = [1, 2, 3, 3, 2, 1]; const unique = [...new Set(arr)]; console.log(unique); // [1, 2, 3] 可以使用 Array.prototype.filter() 方法，将...
es6方法过滤掉两个数组中对象id值相等的项
libertine的博客
04-07 833
let arr1=[{id:1,name:'网'},{id:2,name:'二位'}] let arr2=[{id:1,name:'问问'},{id:3,name:'多少'},{id:44,name:'多少'},{id:45,name:'多少'},] let add=arr2.filter(item=>!arr1.some(ele=>ele.id===item.id)) console.log(add)
vue中@change为什么要绑定一个回调函数_连肝3个晚上，我总结了一份Vue实操绝密干货！（共34条）
weixin_39933356的博客
11-19 953
这是我学习整理的关于 Vue.js 系列文章的第一篇，另外还有两篇分别是关于优化和原理的。希望读完这3篇文章，你能对 Vue 有个更深入的认识。7种组件通信方式随你选组件通信是 Vue 的核心知识，掌握这几个知识点，面试开发一点问题都没有。props/@on+$emit用于实现父子组件间通信。通过 props 可以把父组件的消息传递给子组件：// parent.vue 这样一来 this....
前端面试题--js
weixin_44501366的博客
10-09 5126
SetES6 新增的一种新的的数据结构，类似于数组，但成员是唯一且无序的，没有重复的值。成员不能重复；只有键值，没有键名，有点类似数组；可以遍历，方法有add: 新增，相当于array里的pushdelete: 存在即删除集合中的valuehas: 判断集合中是否存在valueclear: 清空集合Set 结构可以利用Array.from或者 扩展运算符 转化为数组。
前端面试题整理
weixin_46103538的博客
08-12 1258
前端面试题整理 1.JS里的基本引用类型与数据引用类型有哪些，引用类型和基本类型的区别 2.null和undefind区别 1）、undefined：定义变量后，没有赋值 2）、null：对象没有引用的值，即就是：引用类型里没有存储地址。 null是一个表示"无"的对象，转为数值时为0；undefined是一个表示"无"的原始值，转为数值时为NaN。 当声明的变量还未被初始化时，变量的默认值为undefined。 null用来表示尚未存在的对象 undefined表示"缺少值"，就是此处应该有一个值，但是还
Android学习笔记：Android基础知识点（不断更新中）
热门推荐
浩比的专栏
10-28 2万+
1、Android系统的四大组件分别是：活动（Activity）、服务（Service）、广播接收器（Broadcast Receiver）、内容提供器（Content Provider）。 2、定义一个应用程序名的字符串，有以下两种方式来引用它：
数组的递归取值，嵌套数组取值，根据子级ID,查找父级ID，根据子级名称,查找父级名称
m0_51375245的博客
03-03 1049
数组的递归取值，嵌套数组取值，根据子级ID,查找父级ID，根据子级名称,查找父级名称
开发中遇到的递归问题总结（数据的特点有个parentId,主要是把parentId相同的数据整合成tree的要求）
lff18277233091的博客
08-10 280
在vue项目中使用elementUI的tree处理后端返回的数据：数据的特点有个parentId,主要是把parentId相同的数据整合成tree的要求，然后把数据结构在页面中显示出来。data里面定义的数据。
递归--由子级寻找父级
stone10086的博客
06-04 1885
/* * arr原始数组；orgCode：子级code * this.orgCodeList:存放获取的数据 * 主要思想就用递归的方式来循环原始数组 */ getOrgCode (arr, orgCode) { for(let i= 0; i < arr.length; i++) { const item = arr[i] if (!orgCode) { return false } else if (item.orgCode === orgCode) { this.org
多层数据查找相同对象（使用递归函数）
weixin_44134816的博客
10-28 259
【代码】多层数据查找相同对象（使用递归函数）
子Id,递归查找父级Id
m0_48292596的博客
06-23 1783
1.当我们使用elementui el-cascader组件的时候，获取到数据是一个包含父类子类ID的数组，但是有时候后端只需要最后一级的Id, 当我们传给他最后一级ID，他返回来也是同样的ID，这时候el-cascader就回显不了，因为缺少了父类的ID，所以我们可以通过递归查找父类ID 来完成回显...
javascript之递归寻找id
shkstart的博客
09-09 1456
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <script>
对JS数组进行归类（id一样则组成新数组）
weixin_44856917的博客
12-12 1656
对JS数组进行归类（id一样则组成新数组）
转载~过滤两个数组并取出不同/相同项（vue/filter）
BiangBaing的博客
03-29 1168
原文链接 https://blog.csdn.net/miem_yang/article/details/118363671 // 数组A let arrA = ['1111','2222','333','4444','5555'] // 数组B let arrB= ['aaa','bbb','4444','5555','dddd','eeee','ffff','yyyy','mmmm'] 过滤B数组中不包含A数组的项 let differentArr = arrB.filter(item => .
C语言函数：数组传递与参数理解
本篇C语言课程的要点集中在数组在函数中的应用和函数的调用。首先，讨论了在主调函数和被调函数中分别定义数组的重要性，强调了数组名作为函数参数时的特性。在C语言中，数组名传递是按地址进行的，这意味着形参数组...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值