i am getting a flat object of cms navigation and want to transfer it to a nested object.
The level describes the position of the element in the tree.
Whenever there are subelements they should be stored under a new subCategory.
In every level could be multiple elements.
For example two level 1 categories (“shop service” and “information”).
The flat object:
JavaScript
x
48
48
1
[
2
{
3
"categoryId": "2002",
4
"level": "1",
5
"name": "Shop Service"
6
},
7
{
8
"categoryId": "2504",
9
"level": "2",
10
"name": "Neukunde werden"
11
},
12
{
13
"categoryId": "3501",
14
"level": "3",
15
"name": "Ebene 3"
16
},
17
{
18
"categoryId": "3503",
19
"level": "4",
20
"name": "Ebene 4"
21
},
22
{
23
"categoryId": "1009",
24
"level": "2",
25
"name": "Projektanfrage"
26
},
27
{
28
"categoryId": "1008",
29
"level": "2",
30
"name": "Kontakt"
31
},
32
{
33
"categoryId": "3502",
34
"level": "3",
35
"name": "Ebene 3"
36
},
37
{
38
"categoryId": "1019",
39
"level": "1",
40
"name": "Information"
41
},
42
{
43
"categoryId": "1007",
44
"level": "2",
45
"name": "Impressum"
46
}
47
]
48
The result should be a nested object with this structure
JavaScript
1
33
33
1
[
2
{
3
categoryId: '2002',
4
level: '1',
5
name: 'Shop Service',
6
subCategory: [
7
{
8
categoryId: '2504',
9
level: '2',
10
name: 'Neukunde werden',
11
subCategory: {
12
categoryId: '3501',
13
level: '3',
14
name: 'Ebene 3',
15
subCategory: { categoryId: '3503', level: '4', name: 'Ebene 4' },
16
},
17
},
18
{ categoryId: '1009', level: '2', name: 'Projektanfrage' },
19
{
20
categoryId: '1008',
21
level: '2',
22
name: 'Kontakt',
23
subCategory: {
24
categoryId: '3502',
25
level: '3',
26
name: 'Ebene 3',
27
},
28
},
29
],
30
},
31
{ categoryId: '1019', level: '1', name: 'Information' },
32
]
33
I tried serveral ways, but can’t make it.
Thanks in advance.
Stefan
Advertisement
Answer
You can use a stack to track where you are in the tree while it is being constructed.
It is strange that level
has a string data type while clearly its meaning is numeric.
JavaScript
1
14
14
1
const data = [{"categoryId": "2002","level": "1","name": "Shop Service"},{"categoryId": "2504","level": "2","name": "Neukunde werden"},{"categoryId": "3501","level": "3","name": "Ebene 3"},{"categoryId": "3503","level": "4","name": "Ebene 4"},{"categoryId": "1009","level": "2","name": "Projektanfrage"},{"categoryId": "1008","level": "2","name": "Kontakt"},{"categoryId": "3502","level": "3","name": "Ebene 3"},{"categoryId": "1019","level": "1","name": "Information"},{"categoryId": "1007","level": "2","name": "Impressum"}];
2
3
let hierarchy = []; // The final result -- will be populated below
4
let path = [hierarchy]; // A stack
5
for (let obj of data) {
6
if (+obj.level < path.length) path.length = obj.level;
7
if (+obj.level === path.length) {
8
path.at(-1).push(obj);
9
} else if (+obj.level === path.length + 1) {
10
path.push(path.at(-1).at(-1).subCategory = [obj]);
11
} else throw "Unexpected level increase";
12
}
13
14
console.log(hierarchy);