I would like to find the parent of a certain item in a recursive array
{
"uuid": "707a5ffd-68e2-4dbd-b539-128512ba3a0a",
"type": "page",
"items": [
{
"uuid": "9d823429-cc24-444d-a21c-a81357305851",
"title": "1",
"type": "question",
},
{
"type": "section",
"title": "2",
"uuid": "346dec94-124c-4932-bd40-af9dc68f1d27",
"items": [
{
"uuid": "bf0a9ab9-99cc-4833-b3d3-84a97072e85f",
"title": "2.1",
"type": "question",
}
],
},
{
"type": "section",
"title": "3",
"uuid": "4964096d-0de9-4ab1-ace5-e42516d6b866",
"items": [
{
"uuid": "b2170580-1e2e-4fb4-a7b9-a56b79db21b3",
"title": "3.1",
"type": "question",
}
],
}
],
"params": {
"collapsed": false
}
}
I have tried so far:
export const findItemParent = (items, id, parent = null) => {
if (parent && parent.id === id) {
return parent;
}
for (const item of items) {
if (Object.prototype.hasOwnProperty.call(item, 'items')) {
return findItemParent(item.items, id, item);
}
}
return parent;
};
Then I'm calling findItemParent as:
const data = [{...}]; // the data of the first snipet
// b2170580-1e2e-4fb4-a7b9-a56b79db21b3 -> item with title 3.1
const parent = findItemParent(data, "b2170580-1e2e-4fb4-a7b9-a56b79db21b3");
Whenever I run this code I get the parent being 2.
In the case above I'm passing the id of the item with title 3.1 so logically the parent is 3. How can I get the parent of any item given the id?
Using recursion, this is what I've come up with.
The parameter items, I would say is a tad misleading, I would have used something like root.
const findItemParent = (root, id, parent = null) => {
if (root.uuid === id) return parent;
if ('items' in root) {
for (const i of root.items) {
const r = findItemParent(i, id, root);
if (r) return r;
}
}
return null;
};
const data = {
"uuid": "707a5ffd-68e2-4dbd-b539-128512ba3a0a",
"type": "page",
"items": [
{
"uuid": "9d823429-cc24-444d-a21c-a81357305851",
"title": "1",
"type": "question",
},
{
"type": "section",
"title": "2",
"uuid": "346dec94-124c-4932-bd40-af9dc68f1d27",
"items": [
{
"uuid": "bf0a9ab9-99cc-4833-b3d3-84a97072e85f",
"title": "2.1",
"type": "question",
}
],
},
{
"type": "section",
"title": "3",
"uuid": "4964096d-0de9-4ab1-ace5-e42516d6b866",
"items": [
{
"uuid": "b2170580-1e2e-4fb4-a7b9-a56b79db21b3",
"title": "3.1",
"type": "question",
}
],
}
],
"params": {
"collapsed": false
}
};
const findItemParent = (root, id, parent = null) => {
if (root.uuid === id) return parent;
if ('items' in root) {
for (const i of root.items) {
const r = findItemParent(i, id, root);
if (r) return r;
}
}
return null;
};
const parent = findItemParent(data, "b2170580-1e2e-4fb4-a7b9-a56b79db21b3");
if (parent) console.log(parent.title, parent.type, parent.uuid);You can use a recursive function to iterate over the items of each item.
const data = {
"uuid": "707a5ffd-68e2-4dbd-b539-128512ba3a0a",
"type": "page",
"items": [
{
"uuid": "9d823429-cc24-444d-a21c-a81357305851",
"title": "1",
"type": "question",
},
{
"type": "section",
"title": "2",
"uuid": "346dec94-124c-4932-bd40-af9dc68f1d27",
"items": [
{
"uuid": "bf0a9ab9-99cc-4833-b3d3-84a97072e85f",
"title": "2.1",
"type": "question",
}
],
},
{
"type": "section",
"title": "3",
"uuid": "4964096d-0de9-4ab1-ace5-e42516d6b866",
"items": [
{
"uuid": "b2170580-1e2e-4fb4-a7b9-a56b79db21b3",
"title": "3.1",
"type": "question",
}
],
}
],
"params": {
"collapsed": false
}
};
function findItemParent(items, id, parent = null) {
if (items.find(item => item.uuid === id)) return { uuid: parent?.uuid, type: parent?.type, title: parent?.title };
for (const item of items) {
let p;
if (item.type === 'section') {
p = findItemParent(item.items, id, item);
}
if (p) return p;
}
}
console.log(findItemParent(data.items, "b2170580-1e2e-4fb4-a7b9-a56b79db21b3"));I would make a map where you have a reference to the parent in the tree. This is helpful if you have a lot of look ups.
const book = {
"uuid": "707a5ffd-68e2-4dbd-b539-128512ba3a0a",
"type": "page",
"items": [
{
"uuid": "9d823429-cc24-444d-a21c-a81357305851",
"title": "1",
"type": "question",
},
{
"type": "section",
"title": "2",
"uuid": "346dec94-124c-4932-bd40-af9dc68f1d27",
"items": [
{
"uuid": "bf0a9ab9-99cc-4833-b3d3-84a97072e85f",
"title": "2.1",
"type": "question",
}
],
},
{
"type": "section",
"title": "3",
"uuid": "4964096d-0de9-4ab1-ace5-e42516d6b866",
"items": [
{
"uuid": "b2170580-1e2e-4fb4-a7b9-a56b79db21b3",
"title": "3.1",
"type": "question",
}
],
}
],
"params": {
"collapsed": false
}
};
function walkTree(group, parentRef, titleMapping) {
titleMapping = titleMapping || {};
group.items.forEach(function (item) {
titleMapping[item.title] = { ...item, parentRef };
if (item.items) walkTree(item, titleMapping[item.title], titleMapping);
});
return titleMapping;
}
const titleMapping = walkTree(book);
console.log(titleMapping["3.1"].parentRef.title);Other option is to use a recursive find where you look to see if the items contains the title.