How to create a tree-like structure from a JavaScript Object
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}
This is the Object sample I'm given:
Input :
{
"People": [
{
"id": "12",
"parentId": "0",
"text": "Man",
"level": "1",
"children": null
},
{
"id": "6",
"parentId": "12",
"text": "Boy",
"level": "2",
"children": null
},
{
"id": "7",
"parentId": "12",
"text": "Other",
"level": "2",
"children": null
},
{
"id": "9",
"parentId": "0",
"text": "Woman",
"level": "1",
"children": null
},
{
"id": "11",
"parentId": "9",
"text": "Girl",
"level": "2",
"children": null
}
] }
I want to transform it to a JSON format like this:
{
"People": [
{
"id": "12",
"parentId": "0",
"text": "Man",
"level": "1",
"children": [
{
"id": "6",
"parentId": "12",
"text": "Boy",
"level": "2",
"children": null
},
{
"id": "7",
"parentId": "12",
"text": "Other",
"level": "2",
"children": null
}
]
}
}
Any Ideas/Help would be appreciated
javascript json object
|
show 2 more comments
This is the Object sample I'm given:
Input :
{
"People": [
{
"id": "12",
"parentId": "0",
"text": "Man",
"level": "1",
"children": null
},
{
"id": "6",
"parentId": "12",
"text": "Boy",
"level": "2",
"children": null
},
{
"id": "7",
"parentId": "12",
"text": "Other",
"level": "2",
"children": null
},
{
"id": "9",
"parentId": "0",
"text": "Woman",
"level": "1",
"children": null
},
{
"id": "11",
"parentId": "9",
"text": "Girl",
"level": "2",
"children": null
}
] }
I want to transform it to a JSON format like this:
{
"People": [
{
"id": "12",
"parentId": "0",
"text": "Man",
"level": "1",
"children": [
{
"id": "6",
"parentId": "12",
"text": "Boy",
"level": "2",
"children": null
},
{
"id": "7",
"parentId": "12",
"text": "Other",
"level": "2",
"children": null
}
]
}
}
Any Ideas/Help would be appreciated
javascript json object
2
Can you show us what your attempt looked like?
– SpoonMeiser
Nov 16 '18 at 11:47
Wait a minute..
– Nurbol Alpysbayev
Nov 16 '18 at 11:57
I tried implementing the solution of this question: stackoverflow.com/questions/18017869/… but didn't work after editing :/ @SpoonMeiser
– Omar
Nov 16 '18 at 12:12
I almost finished it... it's taking too long.. :)
– Nurbol Alpysbayev
Nov 16 '18 at 12:12
I think that the first example is the best approach you can use. It's the more efficient way of representing the tree.
– Patrik Valkovič
Nov 16 '18 at 12:13
|
show 2 more comments
This is the Object sample I'm given:
Input :
{
"People": [
{
"id": "12",
"parentId": "0",
"text": "Man",
"level": "1",
"children": null
},
{
"id": "6",
"parentId": "12",
"text": "Boy",
"level": "2",
"children": null
},
{
"id": "7",
"parentId": "12",
"text": "Other",
"level": "2",
"children": null
},
{
"id": "9",
"parentId": "0",
"text": "Woman",
"level": "1",
"children": null
},
{
"id": "11",
"parentId": "9",
"text": "Girl",
"level": "2",
"children": null
}
] }
I want to transform it to a JSON format like this:
{
"People": [
{
"id": "12",
"parentId": "0",
"text": "Man",
"level": "1",
"children": [
{
"id": "6",
"parentId": "12",
"text": "Boy",
"level": "2",
"children": null
},
{
"id": "7",
"parentId": "12",
"text": "Other",
"level": "2",
"children": null
}
]
}
}
Any Ideas/Help would be appreciated
javascript json object
This is the Object sample I'm given:
Input :
{
"People": [
{
"id": "12",
"parentId": "0",
"text": "Man",
"level": "1",
"children": null
},
{
"id": "6",
"parentId": "12",
"text": "Boy",
"level": "2",
"children": null
},
{
"id": "7",
"parentId": "12",
"text": "Other",
"level": "2",
"children": null
},
{
"id": "9",
"parentId": "0",
"text": "Woman",
"level": "1",
"children": null
},
{
"id": "11",
"parentId": "9",
"text": "Girl",
"level": "2",
"children": null
}
] }
I want to transform it to a JSON format like this:
{
"People": [
{
"id": "12",
"parentId": "0",
"text": "Man",
"level": "1",
"children": [
{
"id": "6",
"parentId": "12",
"text": "Boy",
"level": "2",
"children": null
},
{
"id": "7",
"parentId": "12",
"text": "Other",
"level": "2",
"children": null
}
]
}
}
Any Ideas/Help would be appreciated
javascript json object
javascript json object
edited Nov 17 '18 at 20:29
Omar
asked Nov 16 '18 at 11:46
OmarOmar
1114
1114
2
Can you show us what your attempt looked like?
– SpoonMeiser
Nov 16 '18 at 11:47
Wait a minute..
– Nurbol Alpysbayev
Nov 16 '18 at 11:57
I tried implementing the solution of this question: stackoverflow.com/questions/18017869/… but didn't work after editing :/ @SpoonMeiser
– Omar
Nov 16 '18 at 12:12
I almost finished it... it's taking too long.. :)
– Nurbol Alpysbayev
Nov 16 '18 at 12:12
I think that the first example is the best approach you can use. It's the more efficient way of representing the tree.
– Patrik Valkovič
Nov 16 '18 at 12:13
|
show 2 more comments
2
Can you show us what your attempt looked like?
– SpoonMeiser
Nov 16 '18 at 11:47
Wait a minute..
– Nurbol Alpysbayev
Nov 16 '18 at 11:57
I tried implementing the solution of this question: stackoverflow.com/questions/18017869/… but didn't work after editing :/ @SpoonMeiser
– Omar
Nov 16 '18 at 12:12
I almost finished it... it's taking too long.. :)
– Nurbol Alpysbayev
Nov 16 '18 at 12:12
I think that the first example is the best approach you can use. It's the more efficient way of representing the tree.
– Patrik Valkovič
Nov 16 '18 at 12:13
2
2
Can you show us what your attempt looked like?
– SpoonMeiser
Nov 16 '18 at 11:47
Can you show us what your attempt looked like?
– SpoonMeiser
Nov 16 '18 at 11:47
Wait a minute..
– Nurbol Alpysbayev
Nov 16 '18 at 11:57
Wait a minute..
– Nurbol Alpysbayev
Nov 16 '18 at 11:57
I tried implementing the solution of this question: stackoverflow.com/questions/18017869/… but didn't work after editing :/ @SpoonMeiser
– Omar
Nov 16 '18 at 12:12
I tried implementing the solution of this question: stackoverflow.com/questions/18017869/… but didn't work after editing :/ @SpoonMeiser
– Omar
Nov 16 '18 at 12:12
I almost finished it... it's taking too long.. :)
– Nurbol Alpysbayev
Nov 16 '18 at 12:12
I almost finished it... it's taking too long.. :)
– Nurbol Alpysbayev
Nov 16 '18 at 12:12
I think that the first example is the best approach you can use. It's the more efficient way of representing the tree.
– Patrik Valkovič
Nov 16 '18 at 12:13
I think that the first example is the best approach you can use. It's the more efficient way of representing the tree.
– Patrik Valkovič
Nov 16 '18 at 12:13
|
show 2 more comments
2 Answers
2
active
oldest
votes
You could use an object for the reference to either child or parent and collect the children and parents to get only the person for the root.
var data = { John: "James", Samar: "Michel", Albert: "Michel", Michel: "James", James: "Sarah" },
parents = new Set,
children = new Set,
references = {},
result;
Object
.entries(data)
.forEach(([child, parent]) => {
references[child] = references[child] || ;
references[parent] = references[parent] || ;
references[parent].push({ [child]: references[child] });
parents.add(parent);
children.add(child);
});
result = [...parents]
.filter(p => !children.has(p))
.map(p => ({ [p]: references[p] }));
console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }
This works perfectly, Thanks
– Omar
Nov 16 '18 at 12:36
add a comment |
OMG this seemingly simple stuff took so long
const users = {
"John": "James",
"Samar": "Michel",
"Albert": "Michel",
"Michel": "James",
"James": "Sarah"
}
const findRoots = () => Object.keys(users).filter(k => !(users[k] in users)).map(k => users[k])
const findSubordinates = (boss) => Object.keys(users).filter(k => users[k] === boss)
const traverseBoss = (boss) => {
let subs = findSubordinates(boss)
let subsCollection =
subs.forEach(s => {
subsCollection.push({
[s]: traverseBoss(s)
})
})
return subsCollection
}
const result = {}
findRoots().forEach(root => result[root] = traverseBoss(root))
console.log(result)
you could add your answer as a code snipet
– Dhaval Pankhaniya
Nov 16 '18 at 12:27
This works perfectly, Thanks
– Omar
Nov 16 '18 at 12:36
@Hussler you could at least upvote it if it works...
– Nurbol Alpysbayev
Nov 16 '18 at 13:26
@NurbolAlpysbayev I'm sorry but I have a new account and I cannot upvote :/
– Omar
Nov 16 '18 at 13:50
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53337241%2fhow-to-create-a-tree-like-structure-from-a-javascript-object%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
You could use an object for the reference to either child or parent and collect the children and parents to get only the person for the root.
var data = { John: "James", Samar: "Michel", Albert: "Michel", Michel: "James", James: "Sarah" },
parents = new Set,
children = new Set,
references = {},
result;
Object
.entries(data)
.forEach(([child, parent]) => {
references[child] = references[child] || ;
references[parent] = references[parent] || ;
references[parent].push({ [child]: references[child] });
parents.add(parent);
children.add(child);
});
result = [...parents]
.filter(p => !children.has(p))
.map(p => ({ [p]: references[p] }));
console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }
This works perfectly, Thanks
– Omar
Nov 16 '18 at 12:36
add a comment |
You could use an object for the reference to either child or parent and collect the children and parents to get only the person for the root.
var data = { John: "James", Samar: "Michel", Albert: "Michel", Michel: "James", James: "Sarah" },
parents = new Set,
children = new Set,
references = {},
result;
Object
.entries(data)
.forEach(([child, parent]) => {
references[child] = references[child] || ;
references[parent] = references[parent] || ;
references[parent].push({ [child]: references[child] });
parents.add(parent);
children.add(child);
});
result = [...parents]
.filter(p => !children.has(p))
.map(p => ({ [p]: references[p] }));
console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }
This works perfectly, Thanks
– Omar
Nov 16 '18 at 12:36
add a comment |
You could use an object for the reference to either child or parent and collect the children and parents to get only the person for the root.
var data = { John: "James", Samar: "Michel", Albert: "Michel", Michel: "James", James: "Sarah" },
parents = new Set,
children = new Set,
references = {},
result;
Object
.entries(data)
.forEach(([child, parent]) => {
references[child] = references[child] || ;
references[parent] = references[parent] || ;
references[parent].push({ [child]: references[child] });
parents.add(parent);
children.add(child);
});
result = [...parents]
.filter(p => !children.has(p))
.map(p => ({ [p]: references[p] }));
console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }
You could use an object for the reference to either child or parent and collect the children and parents to get only the person for the root.
var data = { John: "James", Samar: "Michel", Albert: "Michel", Michel: "James", James: "Sarah" },
parents = new Set,
children = new Set,
references = {},
result;
Object
.entries(data)
.forEach(([child, parent]) => {
references[child] = references[child] || ;
references[parent] = references[parent] || ;
references[parent].push({ [child]: references[child] });
parents.add(parent);
children.add(child);
});
result = [...parents]
.filter(p => !children.has(p))
.map(p => ({ [p]: references[p] }));
console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }
var data = { John: "James", Samar: "Michel", Albert: "Michel", Michel: "James", James: "Sarah" },
parents = new Set,
children = new Set,
references = {},
result;
Object
.entries(data)
.forEach(([child, parent]) => {
references[child] = references[child] || ;
references[parent] = references[parent] || ;
references[parent].push({ [child]: references[child] });
parents.add(parent);
children.add(child);
});
result = [...parents]
.filter(p => !children.has(p))
.map(p => ({ [p]: references[p] }));
console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }
var data = { John: "James", Samar: "Michel", Albert: "Michel", Michel: "James", James: "Sarah" },
parents = new Set,
children = new Set,
references = {},
result;
Object
.entries(data)
.forEach(([child, parent]) => {
references[child] = references[child] || ;
references[parent] = references[parent] || ;
references[parent].push({ [child]: references[child] });
parents.add(parent);
children.add(child);
});
result = [...parents]
.filter(p => !children.has(p))
.map(p => ({ [p]: references[p] }));
console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }
answered Nov 16 '18 at 12:22
Nina ScholzNina Scholz
196k15108179
196k15108179
This works perfectly, Thanks
– Omar
Nov 16 '18 at 12:36
add a comment |
This works perfectly, Thanks
– Omar
Nov 16 '18 at 12:36
This works perfectly, Thanks
– Omar
Nov 16 '18 at 12:36
This works perfectly, Thanks
– Omar
Nov 16 '18 at 12:36
add a comment |
OMG this seemingly simple stuff took so long
const users = {
"John": "James",
"Samar": "Michel",
"Albert": "Michel",
"Michel": "James",
"James": "Sarah"
}
const findRoots = () => Object.keys(users).filter(k => !(users[k] in users)).map(k => users[k])
const findSubordinates = (boss) => Object.keys(users).filter(k => users[k] === boss)
const traverseBoss = (boss) => {
let subs = findSubordinates(boss)
let subsCollection =
subs.forEach(s => {
subsCollection.push({
[s]: traverseBoss(s)
})
})
return subsCollection
}
const result = {}
findRoots().forEach(root => result[root] = traverseBoss(root))
console.log(result)
you could add your answer as a code snipet
– Dhaval Pankhaniya
Nov 16 '18 at 12:27
This works perfectly, Thanks
– Omar
Nov 16 '18 at 12:36
@Hussler you could at least upvote it if it works...
– Nurbol Alpysbayev
Nov 16 '18 at 13:26
@NurbolAlpysbayev I'm sorry but I have a new account and I cannot upvote :/
– Omar
Nov 16 '18 at 13:50
add a comment |
OMG this seemingly simple stuff took so long
const users = {
"John": "James",
"Samar": "Michel",
"Albert": "Michel",
"Michel": "James",
"James": "Sarah"
}
const findRoots = () => Object.keys(users).filter(k => !(users[k] in users)).map(k => users[k])
const findSubordinates = (boss) => Object.keys(users).filter(k => users[k] === boss)
const traverseBoss = (boss) => {
let subs = findSubordinates(boss)
let subsCollection =
subs.forEach(s => {
subsCollection.push({
[s]: traverseBoss(s)
})
})
return subsCollection
}
const result = {}
findRoots().forEach(root => result[root] = traverseBoss(root))
console.log(result)
you could add your answer as a code snipet
– Dhaval Pankhaniya
Nov 16 '18 at 12:27
This works perfectly, Thanks
– Omar
Nov 16 '18 at 12:36
@Hussler you could at least upvote it if it works...
– Nurbol Alpysbayev
Nov 16 '18 at 13:26
@NurbolAlpysbayev I'm sorry but I have a new account and I cannot upvote :/
– Omar
Nov 16 '18 at 13:50
add a comment |
OMG this seemingly simple stuff took so long
const users = {
"John": "James",
"Samar": "Michel",
"Albert": "Michel",
"Michel": "James",
"James": "Sarah"
}
const findRoots = () => Object.keys(users).filter(k => !(users[k] in users)).map(k => users[k])
const findSubordinates = (boss) => Object.keys(users).filter(k => users[k] === boss)
const traverseBoss = (boss) => {
let subs = findSubordinates(boss)
let subsCollection =
subs.forEach(s => {
subsCollection.push({
[s]: traverseBoss(s)
})
})
return subsCollection
}
const result = {}
findRoots().forEach(root => result[root] = traverseBoss(root))
console.log(result)
OMG this seemingly simple stuff took so long
const users = {
"John": "James",
"Samar": "Michel",
"Albert": "Michel",
"Michel": "James",
"James": "Sarah"
}
const findRoots = () => Object.keys(users).filter(k => !(users[k] in users)).map(k => users[k])
const findSubordinates = (boss) => Object.keys(users).filter(k => users[k] === boss)
const traverseBoss = (boss) => {
let subs = findSubordinates(boss)
let subsCollection =
subs.forEach(s => {
subsCollection.push({
[s]: traverseBoss(s)
})
})
return subsCollection
}
const result = {}
findRoots().forEach(root => result[root] = traverseBoss(root))
console.log(result)
const users = {
"John": "James",
"Samar": "Michel",
"Albert": "Michel",
"Michel": "James",
"James": "Sarah"
}
const findRoots = () => Object.keys(users).filter(k => !(users[k] in users)).map(k => users[k])
const findSubordinates = (boss) => Object.keys(users).filter(k => users[k] === boss)
const traverseBoss = (boss) => {
let subs = findSubordinates(boss)
let subsCollection =
subs.forEach(s => {
subsCollection.push({
[s]: traverseBoss(s)
})
})
return subsCollection
}
const result = {}
findRoots().forEach(root => result[root] = traverseBoss(root))
console.log(result)
const users = {
"John": "James",
"Samar": "Michel",
"Albert": "Michel",
"Michel": "James",
"James": "Sarah"
}
const findRoots = () => Object.keys(users).filter(k => !(users[k] in users)).map(k => users[k])
const findSubordinates = (boss) => Object.keys(users).filter(k => users[k] === boss)
const traverseBoss = (boss) => {
let subs = findSubordinates(boss)
let subsCollection =
subs.forEach(s => {
subsCollection.push({
[s]: traverseBoss(s)
})
})
return subsCollection
}
const result = {}
findRoots().forEach(root => result[root] = traverseBoss(root))
console.log(result)
edited Nov 16 '18 at 13:30
answered Nov 16 '18 at 12:21
Nurbol AlpysbayevNurbol Alpysbayev
4,8341533
4,8341533
you could add your answer as a code snipet
– Dhaval Pankhaniya
Nov 16 '18 at 12:27
This works perfectly, Thanks
– Omar
Nov 16 '18 at 12:36
@Hussler you could at least upvote it if it works...
– Nurbol Alpysbayev
Nov 16 '18 at 13:26
@NurbolAlpysbayev I'm sorry but I have a new account and I cannot upvote :/
– Omar
Nov 16 '18 at 13:50
add a comment |
you could add your answer as a code snipet
– Dhaval Pankhaniya
Nov 16 '18 at 12:27
This works perfectly, Thanks
– Omar
Nov 16 '18 at 12:36
@Hussler you could at least upvote it if it works...
– Nurbol Alpysbayev
Nov 16 '18 at 13:26
@NurbolAlpysbayev I'm sorry but I have a new account and I cannot upvote :/
– Omar
Nov 16 '18 at 13:50
you could add your answer as a code snipet
– Dhaval Pankhaniya
Nov 16 '18 at 12:27
you could add your answer as a code snipet
– Dhaval Pankhaniya
Nov 16 '18 at 12:27
This works perfectly, Thanks
– Omar
Nov 16 '18 at 12:36
This works perfectly, Thanks
– Omar
Nov 16 '18 at 12:36
@Hussler you could at least upvote it if it works...
– Nurbol Alpysbayev
Nov 16 '18 at 13:26
@Hussler you could at least upvote it if it works...
– Nurbol Alpysbayev
Nov 16 '18 at 13:26
@NurbolAlpysbayev I'm sorry but I have a new account and I cannot upvote :/
– Omar
Nov 16 '18 at 13:50
@NurbolAlpysbayev I'm sorry but I have a new account and I cannot upvote :/
– Omar
Nov 16 '18 at 13:50
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53337241%2fhow-to-create-a-tree-like-structure-from-a-javascript-object%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
2
Can you show us what your attempt looked like?
– SpoonMeiser
Nov 16 '18 at 11:47
Wait a minute..
– Nurbol Alpysbayev
Nov 16 '18 at 11:57
I tried implementing the solution of this question: stackoverflow.com/questions/18017869/… but didn't work after editing :/ @SpoonMeiser
– Omar
Nov 16 '18 at 12:12
I almost finished it... it's taking too long.. :)
– Nurbol Alpysbayev
Nov 16 '18 at 12:12
I think that the first example is the best approach you can use. It's the more efficient way of representing the tree.
– Patrik Valkovič
Nov 16 '18 at 12:13