项目场景：

项目场景：按照相同关键字归类整合成新数组。
例如：按照学生的班级(class)和队名(team)为关键组合，将相同匹配数据的成员(member)归纳到一起

问题描述

json:

arr:[
{class:"a",team:"hero",member:[{name:"Tom",hobby:"足球"}]}
{class:"b",team:"spider",member:[{name:"Amy",hobby:"旅游"}]}
{class:"c",team:"star",member:[{name:"Crise",hobby:"爬山"}]}
{class:"a",team:"hero",member:[{name:"Lili",hobby:"画画"}]}
]

问题一：真实项目中，class和team不止案例中的三种，且组合多种多样。怎样使用循环将数据中的member合并
问题二：在循环处理数据的过程中，发现元数据也发生了改变，而在js语句中并无改变源数组的方法

解决方案：

问题一：

subOption(){let subArr = [];//要提交的数据let repeatArr = [];//保存重复数据let isRepeat = (m,n) => {return m.class==n.class&&m.team==n.team};//判断是否重复for(let i=0;i<this.arr.length;i++){let item = this.arr[i];let repeatFlag = subArr.findIndex(el => isRepeat(el,item));if(repeatFlag>-1){repeatArr.push({index:repeatFlag,combine:item})}else{subArr.push(item);}}for(let j=0;j<subArr.length;j++){for(let k=0;k<repeatArr.length;k++){if(j==repeatArr[k].index)subArr[j].member = subArr[j].member.concat(repeatArr[k].combine.member)}}console.log(subArr)
}

思路：主要分为两个步骤，1.统计重复，2.合并数组

问题二：
在以上代码运行时发现数据总是不对应，arr是数据源，一眼望去push不会修改源数组，也无赋值等会造成源数组改变的操作，但同时打印源数组与自定义subArr 却发现源数组也发生了改变。
原因：数据嵌套太多层，push只拷贝了arr内部元素，而arr内部元素的数组元素索引依旧不变。
解决：一种是通过递归深拷贝数据，另一种是借助JSON.stringify。由于我用到的数据没有涉及时间格式等JSON.stringify不能转化的格式，我选用的第二种：

let copySource = JSON.parse(JSON.stringify(this.arr))
//后续将this.arr位置全替换成copySource

js对以下结构数组处理时遇到的问题（arr:[{class:“a“,team:“hero“,member:[{name:“Tom“,hobby:[“读书“,“看报“]}]}],...]）相关推荐

js获取数据，数组和对象的获取
js遍历数据,数组和对象的遍历 const arr=[{naem:zhangsan}{name:lisi}] let obj ={naem:zhangsan} 数组需要先进行for循环,获取到数组里面 ...
笔记之js使用ajax接受服务器传过来的数组异常时的情况处理（含视频）
js使用ajax接受服务器传过来的数组异常时的情况处理使用ajax传输数据时,有时候我们会以数组的格式进行传输,并且大部分使用json的方式传输,那么当我们传输一个数组,比如: [{"na ...
js树形结构数组扁平化
js树形结构数组扁平化 1. 树形结构 ---- > 扁平化数据一.树形结构 ---- > 扁平化数据 (数据) const newData: any = [{"id" ...
js中对arry数组的各种操作小结
最近工作比较轻松,于是就花时间从头到尾的对js进行了详细的学习和复习,在看书的过程中,发现自己平时在做项目的过程中有很多地方想得不过全面,写的不够合理,所以说啊,为了在以后的工作中写出最优化的代码,我 ...
循环数组函数c语言,C语言练习题2(分支结构循环结构数组函数2009-2012二级真题)..doc...
C语言练习题2(分支结构循环结构数组函数2009-2012二级真题). C语言练习题(二) 一选择题 1．有以下程序 #include void main() { int a: canf(" ...
Silverlight调用的JS方法返回对象数组的处理方法
最近在做Silverlight应用,需要用Silverlight调用页面中Javascript方法.这个JS方法返回一个对象数组给Silverlight.对于这个对象数组怎么在Silverlight里 ...
对C语言结构数组指向结构变量的指针指向结构数组的指针
一.结构数组的定义数组的元素可以是结构类型的.结构数组的每一个元素都是具有相同的结构类型的下标结构变量.在实际应用中,经常用结构数组来表示具有相同数据结构的一个群体. 如:一个班的学生的档案,一个车 ...
探讨JS合并两个数组的方法
转载自探讨JS合并两个数组的方法我们在项目过程中,有时候会遇到需要将两个数组合并成为一个的情况. 比如: var a = [1,2,3]; var b = [4,5,6]; 有两个数组a.b,需 ...
算法(6)-leetcode-explore-learn-数据结构-数组字符串的双指针技巧
leetcode-explore-learn-数据结构-数组4-双指针技巧 1.双指针技巧--适用情形1 1.1概述 1.2 例题 1.2.1 反转字符串 1.2.2数组拆分 1.2.3 两数之和2 ...

js对以下结构数组处理时遇到的问题（arr:[{class:“a“,team:“hero“,member:[{name:“Tom“,hobby:[“读书“,“看报“]}]}],...]）

项目场景：

问题描述

解决方案：

js对以下结构数组处理时遇到的问题（arr:[{class:“a“,team:“hero“,member:[{name:“Tom“,hobby:[“读书“,“看报“]}]}],...]）相关推荐

最新文章

热门文章