JS中具有多个级别的嵌套对象的组数组
[英]Group array of nested objects with multiple levels in JS
问题描述
I'm trying to group a big nested object with multiple properties such as this one:
我正在尝试将具有多个属性的大型嵌套对象分组，例如：
[
{
"_id": "5e7f4d61236c2257490064b4",
"status": true,
"name": "Biyokimya",
"type": [
{
"_id": "5e7a78bc07c289220864436e",
"name": "TUS",
"__v": 0
}
],
"__v": 0,
"branch": [
216,
222,
212
],
"end_date": "2021-09-30T21:00:00.000Z",
"grade": [
2022,
2020
],
"start_date": "2020-10-25T18:47:54.896Z",
"subtype": [
{
"_id": "5f948e39a506ab395ea61f77",
"name": "Temel Bilimler",
"__v": 0
}
],
"year": 2019,
"videos": [
{
"_id": "5eb9559389972764a79aa814",
"live": false,
"medianova": true,
"status": true,
"name": "Ders 1",
"link": "416924989",
"start_date": "2020-05-11T13:39:11.000Z",
"end_date": "2021-05-11T13:39:13.000Z",
"category": "5e7f4d61236c2257490064b4",
"__v": 0
},
{
"_id": "5eb955a089972764a79aa815",
"live": false,
"medianova": true,
"status": true,
"name": "Ders 2",
"link": "416925154",
"start_date": "2020-05-11T13:39:11.000Z",
"end_date": "2021-05-11T13:39:13.000Z",
"category": "5e7f4d61236c2257490064b4",
"__v": 0
},
{
"_id": "5eb955ad89972764a79aa816",
"live": false,
"medianova": true,
"status": true,
"name": "Ders 3",
"link": "416925143",
"start_date": "2020-05-11T13:39:11.000Z",
"end_date": "2021-05-11T13:39:13.000Z",
"category": "5e7f4d61236c2257490064b4",
"__v": 0
},
{
"_id": "5eb955b789972764a79aa817",
"live": false,
"medianova": true,
"status": true,
"name": "Ders 4",
"link": "416925130",
"start_date": "2020-05-11T13:39:11.000Z",
"end_date": "2021-05-11T13:39:13.000Z",
"category": "5e7f4d61236c2257490064b4",
"__v": 0
},
{
"_id": "5eb955c289972764a79aa818",
"live": false,
"medianova": true,
"status": true,
"name": "Ders 5",
"link": "416925116",
"start_date": "2020-05-11T13:39:11.000Z",
"end_date": "2021-05-11T13:39:13.000Z",
"category": "5e7f4d61236c2257490064b4",
"__v": 0
}
]
},
{
"_id": "5e8b9489f9ae7734dc061419",
"status": true,
"name": "Endodonti",
"type": [
{
"_id": "5e7a78c007c289220864436f",
"name": "DUS",
"__v": 0
}
],
"__v": 0,
"branch": [
212,
462
],
"end_date": "2021-10-30T21:00:00.000Z",
"grade": [
2023,
2022,
],
"start_date": "2020-10-29T19:17:53.649Z",
"subtype": [
{
"_id": "5f948e3da506ab395ea61f78",
"name": "Klinik Bilimler",
"__v": 0
}
],
"videos": [
{
"_id": "5eb5eccf89972764a79aa7f6",
"live": false,
"medianova": true,
"status": true,
"name": "Ders 1",
"link": "416513498",
"start_date": "2020-05-08T23:35:25.000Z",
"end_date": "2021-05-08T23:35:26.000Z",
"category": "5e8b9489f9ae7734dc061419",
"__v": 0
}
],
"year": 2020
},
{
"_id": "5eac095789972764a79aa675",
"status": true,
"name": "Anatomi",
"type": [
{
"_id": "5e7a78bc07c289220864436e",
"name": "TUS",
"__v": 0
}
],
"__v": 0,
"branch": [
212,
216,
462
],
"end_date": "2021-09-30T21:00:00.000Z",
"grade": [
2025,
],
"start_date": "2020-10-25T14:24:26.866Z",
"subtype": [
{
"_id": "5f948e39a506ab395ea61f77",
"name": "Temel Bilimler",
"__v": 0
}
],
"year": 2020,
"videos": [
{
"_id": "5eac09ae89972764a79aa676",
"live": false,
"medianova": true,
"status": true,
"name": "Ders 1",
"link": "413260985",
"start_date": "2020-05-01T11:36:02.000Z",
"end_date": "2021-05-01T11:36:04.000Z",
"category": "5eac095789972764a79aa675",
"__v": 0
},
{
"_id": "5eac09d989972764a79aa677",
"live": false,
"medianova": true,
"status": true,
"name": "Ders 2",
"link": "413263273",
"start_date": "2020-05-01T11:36:02.000Z",
"end_date": "2021-05-01T11:36:04.000Z",
"category": "5eac095789972764a79aa675",
"__v": 0
},
{
"_id": "5eac09ef89972764a79aa678",
"live": false,
"medianova": true,
"status": true,
"name": "Ders 3",
"link": "413263244",
"start_date": "2020-05-01T11:36:02.000Z",
"end_date": "2021-05-01T11:36:04.000Z",
"category": "5eac095789972764a79aa675",
"__v": 0
},
{
"_id": "5eac0a1c89972764a79aa679",
"live": false,
"medianova": true,
"status": true,
"name": "Ders 4",
"link": "413263225",
"start_date": "2020-05-01T11:36:02.000Z",
"end_date": "2021-05-01T11:36:04.000Z",
"category": "5eac095789972764a79aa675",
"__v": 0
}
]
},
{
"_id": "5eb13e9289972764a79aa760",
"status": true,
"name": "Genel Cerrahi",
"type": [
{
"_id": "5e7a78bc07c289220864436e",
"name": "TUS",
"__v": 0
}
],
"__v": 0,
"branch": [
212,
424,
442,
462
],
"end_date": "2021-10-30T21:00:00.000Z",
"grade": [
2022,
2024
],
"start_date": "2020-10-29T19:18:20.053Z",
"subtype": [
{
"_id": "5f948e3da506ab395ea61f78",
"name": "Klinik Bilimler",
"__v": 0
}
],
"videos": [
{
"_id": "5eb13ed389972764a79aa761",
"live": false,
"medianova": true,
"status": true,
"name": "Ders 1",
"link": "414555752",
"start_date": "2020-05-05T10:24:08.000Z",
"end_date": "2021-05-05T10:24:09.000Z",
"category": "5eb13e9289972764a79aa760",
"__v": 0
},
{
"_id": "5eb13ee589972764a79aa762",
"live": false,
"medianova": true,
"status": true,
"name": "Ders 2",
"link": "414555748",
"start_date": "2020-05-05T10:24:08.000Z",
"end_date": "2021-05-05T10:24:09.000Z",
"category": "5eb13e9289972764a79aa760",
"__v": 0
},
{
"_id": "5eb13ef189972764a79aa763",
"live": false,
"medianova": true,
"status": true,
"name": "Ders 3",
"link": "414555739",
"start_date": "2020-05-05T10:24:08.000Z",
"end_date": "2021-05-05T10:24:09.000Z",
"category": "5eb13e9289972764a79aa760",
"__v": 0
}
],
"year": 2020
}
]
First they will be group as year then by type then by subtype.首先，它们将按年份分组，然后按类型分组，然后按子类型分组。 will be able to come different years.将能够来不同的年份。
I'd like to group the array by object's id recursively to get this kind of output :我想通过对象的 id 递归地对数组进行分组以获得这种输出：
[
{
label: "2019",
children: [
{
label: "TUS",
children: [
{
label: "Temel Bilimler",
children: [
{
label: "Biyokimya",
children: [
{
label: "Ders 1",
id: "xxxxx"
},
{
label: "Ders 2",
id: "xxxxx"
},
// continue data...
]
}
]
}
]
}
]
},
{
label: "2020",
children: [
{
label: "TUS",
children: [
{
label: "Temel Bilimler",
children: [
{
label: "Anatomi",
children: [
{
label: "Ders 1",
id: "xxxxx"
},
{
label: "Ders 2",
id: "xxxxx"
},
// continue data...
]
}
]
},
{
label: "Klinik Bilimler",
children: [{
label: "Genel Cerrahi",
children: [
{
label: "Ders 1",
id: "xxxxx"
},
{
label: "Ders 2",
id: "xxxxx"
},
// continue data...
]
}]
}
]
},
{
label: "DUS",
children: [
{
label: "Klinik Bilimler",
children: [
{
label: "Endodonti",
children: [
{
label: "Ders 1",
id: "xxxx"
}
]
}
]
}
]
}
]
}
]
Have you guys ever face something similar?大家有遇到过类似的情况吗？ And if so, how did you manage to code this?如果是这样，你是如何设法编码的？
Thanks a lot非常感谢
1 个解决方案
解决方案1
0 已采纳 2020-10-29 21:26:55
You could take a object for the grouping labels.您可以为分组标签取一个对象。
const data = [{ _id: "5e7f4d61236c2257490064b4", status: true, name: "Biyokimya", type: [{ _id: "5e7a78bc07c289220864436e", name: "TUS", __v: 0 }], __v: 0, branch: [216, 222, 212], end_date: "2021-09-30T21:00:00.000Z", grade: [2022, 2020], start_date: "2020-10-25T18:47:54.896Z", subtype: [{ _id: "5f948e39a506ab395ea61f77", name: "Temel Bilimler", __v: 0 }], year: 2019, videos: [{ _id: "5eb9559389972764a79aa814", live: false, medianova: true, status: true, name: "Ders 1", link: "416924989", start_date: "2020-05-11T13:39:11.000Z", end_date: "2021-05-11T13:39:13.000Z", category: "5e7f4d61236c2257490064b4", __v: 0 }, { _id: "5eb955a089972764a79aa815", live: false, medianova: true, status: true, name: "Ders 2", link: "416925154", start_date: "2020-05-11T13:39:11.000Z", end_date: "2021-05-11T13:39:13.000Z", category: "5e7f4d61236c2257490064b4", __v: 0 }, { _id: "5eb955ad89972764a79aa816", live: false, medianova: true, status: true, name: "Ders 3", link: "416925143", start_date: "2020-05-11T13:39:11.000Z", end_date: "2021-05-11T13:39:13.000Z", category: "5e7f4d61236c2257490064b4", __v: 0 }, { _id: "5eb955b789972764a79aa817", live: false, medianova: true, status: true, name: "Ders 4", link: "416925130", start_date: "2020-05-11T13:39:11.000Z", end_date: "2021-05-11T13:39:13.000Z", category: "5e7f4d61236c2257490064b4", __v: 0 }, { _id: "5eb955c289972764a79aa818", live: false, medianova: true, status: true, name: "Ders 5", link: "416925116", start_date: "2020-05-11T13:39:11.000Z", end_date: "2021-05-11T13:39:13.000Z", category: "5e7f4d61236c2257490064b4", __v: 0 }] }, { _id: "5e8b9489f9ae7734dc061419", status: true, name: "Endodonti", type: [{ _id: "5e7a78c007c289220864436f", name: "DUS", __v: 0 }], __v: 0, branch: [212, 462], end_date: "2021-10-30T21:00:00.000Z", grade: [2023, 2022], start_date: "2020-10-29T19:17:53.649Z", subtype: [{ _id: "5f948e3da506ab395ea61f78", name: "Klinik Bilimler", __v: 0 }], videos: [{ _id: "5eb5eccf89972764a79aa7f6", live: false, medianova: true, status: true, name: "Ders 1", link: "416513498", start_date: "2020-05-08T23:35:25.000Z", end_date: "2021-05-08T23:35:26.000Z", category: "5e8b9489f9ae7734dc061419", __v: 0 }], year: 2020 }, { _id: "5eac095789972764a79aa675", status: true, name: "Anatomi", type: [{ _id: "5e7a78bc07c289220864436e", name: "TUS", __v: 0 }], __v: 0, branch: [212, 216, 462], end_date: "2021-09-30T21:00:00.000Z", grade: [2025], start_date: "2020-10-25T14:24:26.866Z", subtype: [{ _id: "5f948e39a506ab395ea61f77", name: "Temel Bilimler", __v: 0 }], year: 2020, videos: [{ _id: "5eac09ae89972764a79aa676", live: false, medianova: true, status: true, name: "Ders 1", link: "413260985", start_date: "2020-05-01T11:36:02.000Z", end_date: "2021-05-01T11:36:04.000Z", category: "5eac095789972764a79aa675", __v: 0 }, { _id: "5eac09d989972764a79aa677", live: false, medianova: true, status: true, name: "Ders 2", link: "413263273", start_date: "2020-05-01T11:36:02.000Z", end_date: "2021-05-01T11:36:04.000Z", category: "5eac095789972764a79aa675", __v: 0 }, { _id: "5eac09ef89972764a79aa678", live: false, medianova: true, status: true, name: "Ders 3", link: "413263244", start_date: "2020-05-01T11:36:02.000Z", end_date: "2021-05-01T11:36:04.000Z", category: "5eac095789972764a79aa675", __v: 0 }, { _id: "5eac0a1c89972764a79aa679", live: false, medianova: true, status: true, name: "Ders 4", link: "413263225", start_date: "2020-05-01T11:36:02.000Z", end_date: "2021-05-01T11:36:04.000Z", category: "5eac095789972764a79aa675", __v: 0 }] }, { _id: "5eb13e9289972764a79aa760", status: true, name: "Genel Cerrahi", type: [{ _id: "5e7a78bc07c289220864436e", name: "TUS", __v: 0 }], __v: 0, branch: [212, 424, 442, 462], end_date: "2021-10-30T21:00:00.000Z", grade: [2022, 2024], start_date: "2020-10-29T19:18:20.053Z", subtype: [{ _id: "5f948e3da506ab395ea61f78", name: "Klinik Bilimler", __v: 0 }], videos: [{ _id: "5eb13ed389972764a79aa761", live: false, medianova: true, status: true, name: "Ders 1", link: "414555752", start_date: "2020-05-05T10:24:08.000Z", end_date: "2021-05-05T10:24:09.000Z", category: "5eb13e9289972764a79aa760", __v: 0 }, { _id: "5eb13ee589972764a79aa762", live: false, medianova: true, status: true, name: "Ders 2", link: "414555748", start_date: "2020-05-05T10:24:08.000Z", end_date: "2021-05-05T10:24:09.000Z", category: "5eb13e9289972764a79aa760", __v: 0 }, { _id: "5eb13ef189972764a79aa763", live: false, medianova: true, status: true, name: "Ders 3", link: "414555739", start_date: "2020-05-05T10:24:08.000Z", end_date: "2021-05-05T10:24:09.000Z", category: "5eb13e9289972764a79aa760", __v: 0 }], year: 2020 }], labels = ['year', 'type', 'subtype', 'name'], result = data.reduce((r, o) => { labels .reduce((level, key) => { const label = Array.isArray(o[key]) ? o[key][0].name : o[key]; let temp = level.find(q => q.label === label) if (!temp) level.push(temp = { label, children: [] }); return temp.children; }, r) .push(...o.videos.map(({ name: label, _id: id }) => ({ label, id }))); return r; }, []); console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.
相关问题
JavaScript 中具有多个级别的嵌套对象的组数组 - Group array of nested objects with multiple levels in JavaScript
如何在js中对嵌套的对象数组进行分组 - How to group nested array of objects in js
按多个嵌套值对对象数组进行分组 - Group array of objects by multiple nested values
如何通过嵌套值将嵌套对象的数组分组为多个数组 - How to Group Array of Nested Objects into Multiple Arrays by Nested Value
对嵌套的对象数组进行分组 - Group nested array of objects
Angular 10，从带有数组的组中嵌套的 3 个级别 - Angular 10, 3 levels of nested from group with array
JavaScript 对象 - 我在访问嵌套多个级别的对象属性数组并将它们组合在一起时遇到问题 - JavaScript Objects - I'm having issues accessing an array of objects properties nested multiple levels & combining them together
使用嵌套在不同级别的键对对象数组进行排序 - Sort array of objects with keys nested at different levels
如何通过 JS 中的三个不同属性对嵌套对象数组进行分组 - How to group an array of nested objects by three different properties in JS
从平面对象数组创建对象的嵌套数组（最多 5 个级别） - Create a nested array of objects (up to 5 levels) from flat array of objects
相关标签