遍历数组对象组成属性结构方法

最新推荐文章于 2024-08-12 17:51:29 发布
最新推荐文章于 2024-08-12 17:51:29 发布
阅读量408 收藏 5
点赞数 6
文章标签： 前端 javascript 开发语言
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_46579829/article/details/135284853
版权

treeData (arr) {
const treeData = []
const arrClone = JSON.parse(JSON.stringify(arr))
const mapInfo = arrClone.reduce((obj, item) => {
item.children = []
obj[item.id] = item
return obj
}, {})
arrClone.forEach(item => {
const parent = mapInfo[item.BelongUp]
parent ? parent.children.push(item) : treeData.push(item)
})
return treeData
},
BelongUp为子节点的一个字段，用来和父级中的id匹配

风铭雪
关注
  • 6
    点赞
  • 踩
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
map方法遍历数组
freedms的博客
03-30 654
首先定义一个包含两个对象的数组，然后使用map方法遍历数组，返回每个对象的b属性值，最终生成一个新的数组。
js遍历数组的五种方法+对象的六种方法
weixin_44211097的博客
10-05 866
遍历对象： 1.for...in 遍历输出的是对象自身的属性以及原型链上可枚举的属性(不含Symbol属性),原型链上的属性最后输出说明先遍历的是自身的可枚举属性,后遍历原型链上的2.Object.keys() 遍历对象返回的是一个包含对象自身可枚举属性的数组(不含Symbol属性).3.Objcet.getOwnPropertyNames() 输出对象自身的可枚举和不可枚举属性的数组,不输出原型链上的属性 4.Reflect.ownKeys() 返回对象自身的所有属性,不管属性名是Symbo...
最全遍历 5种遍历对象和6种遍历数组的方法
狗蛋儿的博客
05-14 3586
一、遍历对象方法 1.for…in eg: 遍历输出的是对象自身的属性以及原型链上可枚举的属性(不含Symbol属性),原型链上的属性最后输出说明先遍历的是自身的可枚举属性,后遍历原型链上的 js var obj = { 'name': "yayaya", 'age': '12', 'sex': 'female' }; Object.prototype.pro1 = function() {};//在原型链上添加属性 Object.defineProperty(obj, 'country', {
JavaScript：js数组/对象遍历方法
snowball的博客
06-03 5780
undefinedfor使用最基本的for循环可以遍历数组。for...of语句用来遍历可迭代对象（包括数组、Set、Map、字符串等），它可以替代传统的for循环和forEach方法。for...of循环每次迭代都将返回一个值，而不是索引。循环还可以遍历字符串，并且能够正确处理 Unicode 字符。需要注意的是:for...of 循环不能遍历普通对象，因为它们不是可迭代对象。对于普通对象，可以使用for...in循环来遍历对象的属性。
几种遍历数组和对象的方法及其区别
weixin_53687450的博客
03-24 867
遍历数组 1、forEach方法 用来调用数组的每个元素，将元素传给回调函数。 不会返回新数组； 无法中途跳出循环，return或break无效； 会跳过数组的空位； 不会改变原始数组。 var arr = [0, ,4,6,8]; var sum = 0; var str = arr.forEach(function(item,index,arr){ sum += item; console.log("sum的值为：",sum); //0 4 10 18 }) console.log(
JS 对象和数组的遍历方法
m0_61700036的博客
01-23 7020
目录 一、JS 遍历数组 1、for 循环遍历数组 2、使用for ……in 遍历数组 3、for……of 遍历数组 4、forEach 遍历数组 5、map遍历数组 二、JS 遍历对象 1、for……in 循环遍历对象 2、Object.keys 遍历对象 3、Object.getOwnPropertyNames(obj) 遍历对象 一、JS 遍历数组 1、for 循环遍历数组 // 1、for循环 let arr = ['d', 'a', 'w', 'n']; for (le
JS 遍历对象数组的方式
爱学习的程序员
05-05 1535
需要注意的是，以上提到的方法都是比较老的方式，对于复杂的对象数组可能不够灵活。注意，对于一个对象数组，可以使用以上方法遍历其中所有的对象元素。但是，对于某个对象元素本身的属性，还需要使用其他方式进行遍历。注意，此方法并不能保证遍历顺序。使用 forEach 方法遍历对象数组，相比于 for 循环，具有更加简洁的语法和更高的可读性。of 循环遍历对象数组，适用于需要遍历对象属性的场合，从 ES6 引入。需要注意的是，以上提到的方法都是 ES5 引入的新特性，使用时需要注意浏览器兼容性问题。
遍历数组的几种方法！
cai_bird1111862的博客
09-08 278
遍历数组的放法
javascript数组——新建数组、访问数组、遍历数组的方法、数组对象的方法、冒泡排序算法、json的正反序列化
TKY666的博客
04-14 1554
数组 是可以在内存中连续存储多个元素的结构 数组的下标索引从0开始，通过length可获取数组的总长度。取值范围[0 , myarr.length-1] 通过构造函数的三种方法 例1： var myarr= new Array() myarr[0]=10; myarr[2]="hello"; 例2： var myarr= new Array(10，"hello")(长度为2 ，) 例3： var myarr= new Array(10) (创建一个长度为10的数组每个元素都为空 只有一..
ASP.NET Core Web API 使用Autofac框架
鲤籽鲲的博客
08-08 494
ASP.NET Core Web API 使用Autofac框架
略记一次抓取内容后解密及登录的经历
深蓝浅蓝的天
08-09 1025
从我这个不专业的爬虫工程师来看，爬虫工作是比较看耐心的，尤其是登录和其他的破解环节，一定要相信，从理论上来破的东西，它确实就能破，但确实太考验耐心了。最后再拿下登录返回的token，准备一台手机，自动接收验证码，然后启一个接受短信的服务存到redis，至此登录、请求接口、解密数据全部完成。，key是接口有返回的，但iv对方网站就隐藏的很好，除了这个iv，其他的问题都解决了，加密字符串也成功解密。尤其是解密的代码，调用栈太长了，我水平不够，整整看了2天，才从这种代码中找出了它主要的解密方式，
前端JS总结（中）
m0_54066656的博客
08-12 609
前端JS之内置对象总结，这很重要！！！
05_ Electron 自定义菜单、主进程与渲染进程通信
所学所思
08-09 621
单独写在一个 js 文件中，然后再在主进程中引入labe: "文件",submenu: [label: "新建文件",},label: "编辑",submenu: [label: "复制",},submenu: [// main.js// 1、引入初始化remote 模块width:800,})// __dirname 表示获取我们当前目录， path.join 会将两个参数合并成 d://electrondemo/index.html// 打开调试模式。
前端面试宝典【CSS篇】【4】
BDawn的专栏
08-06 745
盒子模型是 CSS 中用于描述 HTML 元素布局方式的一个概念。在 CSS 中，每个元素都被视为一个矩形盒子，这个盒子由几个不同的部分组成：内容区（content）、内边距（padding）、边框（border）和外边距（margin）。 box-sizing 属性是 CSS 中的一个重要属性，它用于定义元素的盒模型是如何工作的。 CSS Sprites（也称为 CSS 精灵或 CSS 雪碧图）是一种优化网页性能的技术，它将多个小图像合并成一个单一的大图像文件
js深度解构
最新发布
Zing_ing的博客
08-12 270
深度解构（Deep Destructuring）是指在解构赋值中，解构对象或数组中的嵌套结构。它允许你从复杂的数据结构中直接提取所需的嵌套数据，使代码更加简洁明了。
Vue项目通过宝塔部署之后，页面刷新后浏览器404页面
水w的博客
08-07 317
Vue项目通过宝塔部署之后，页面刷新后浏览器404页面
SpringSecurity+前端项目+redis完成认证授权的代码
m0_74194490的博客
08-12 299
（包含了对密码加密、用户认证授权、登录前后的权限设置==》开启允许跨域。①创建令牌---②校验令牌---③根据token获取自定义的信息。由于都是无返回值类型的，所有使用到了fastjson）
【Ajax使用说明】Ajax、Axios以及跨域
aaaa_aaab的博客
08-12 669
XML：可扩展标记语言XML：被设计用来传输和存储数据XML和HTML类似，不同点：HTML中都是预定义标签，XML中没有预定义标签，全是自定义标签，用来表示一些数据现在已被JSON取代。
一个父级数组对象一个子级数组对象 组成父子级结构
06-13
如果我们有一个父级数组对象和一个子级数组对象，同样可以使用类似的方法将它们组成父子级结构。我们可以先将父级数组对象和子级数组对象中的每个元素都放入 Map 中，并将它们的 id 作为 Map 的键，然后使用一个循环遍历子级数组对象，每次取出一个子级元素对象，找到它在 Map 中对应的父级元素对象，并将该子级元素对象添加到父级元素对象的子节点列表中。 以下是一个简单的 Java 代码实现： ``` public static List<TreeNode> buildTree(List<Parent> parents, List<Child> children) { Map<Integer, TreeNode> map = new HashMap<>(); // 将父级数组对象和子级数组对象中的每个元素都放入 Map 中 for (Parent parent : parents) { map.put(parent.getId(), new TreeNode(parent.getId(), parent.getName())); } for (Child child : children) { map.put(child.getId(), new TreeNode(child.getId(), child.getName())); } // 遍历子级数组对象，将子级元素对象添加到对应的父级元素对象的子节点列表中 for (Child child : children) { int parentId = child.getParentId(); TreeNode parentNode = map.get(parentId); TreeNode childNode = map.get(child.getId()); parentNode.addChild(childNode); } // 找到根节点 List<TreeNode> roots = new ArrayList<>(); for (TreeNode node : map.values()) { if (node.getParent() == null) { roots.add(node); } } return roots; } ``` 其中，Parent 和 Child 是父级数组对象和子级数组对象的类，包含 id 和 name 两个属性。 ``` public class Parent { private int id; private String name; public Parent(int id, String name) { this.id = id; this.name = name; } public int getId() { return id; } public void setId(int id) { this.id = id; } public String getName() { return name; } public void setName(String name) { this.name = name; } } public class Child { private int id; private String name; private int parentId; public Child(int id, String name, int parentId) { this.id = id; this.name = name; this.parentId = parentId; } public int getId() { return id; } public void setId(int id) { this.id = id; } public String getName() { return name; } public void setName(String name) { this.name = name; } public int getParentId() { return parentId; } public void setParentId(int parentId) { this.parentId = parentId; } } ``` 这个函数的输入是一个父级数组对象和一个子级数组对象，输出是一个树形结构，每个节点包含一个 id、name 和它的子节点列表。如果一个节点没有父节点，它就是根节点。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值