CoderFunda
  • Home
  • About us
    • Contact Us
    • Disclaimer
    • Privacy Policy
    • About us
  • Home
  • Php
  • HTML
  • CSS
  • JavaScript
    • JavaScript
    • Jquery
    • JqueryUI
    • Stock
  • SQL
  • Vue.Js
  • Python
  • Wordpress
  • C++
    • C++
    • C
  • Laravel
    • Laravel
      • Overview
      • Namespaces
      • Middleware
      • Routing
      • Configuration
      • Application Structure
      • Installation
    • Overview
  • DBMS
    • DBMS
      • PL/SQL
      • SQLite
      • MongoDB
      • Cassandra
      • MySQL
      • Oracle
      • CouchDB
      • Neo4j
      • DB2
      • Quiz
    • Overview
  • Entertainment
    • TV Series Update
    • Movie Review
    • Movie Review
  • More
    • Vue. Js
    • Php Question
    • Php Interview Question
    • Laravel Interview Question
    • SQL Interview Question
    • IAS Interview Question
    • PCS Interview Question
    • Technology
    • Other

06 August, 2024

Traverse over tree type structured data using JavaScript

 Programing Coderfunda     August 06, 2024     No comments   

I have a data set having parent and nested children in it. The purpose of this data is to traverse over parent.
1
/ \
2 3
/ \ / \
4 5 6 7



First traverse 1,2,4 Now 4 has no children During back traverse in else part output 4, 2 then it should go to 2, 5


Now, 5 is end. Trace isVisited in parent nodes if any of the child is property isVisited as false.
5,2,1,3



Expected Output:-
1, 2, 4, 2, 5, 2, 1, 3, 6, 3, 7



Once the node end is reached start traversing reverse direction from end of node to start e.g. child2 where other children were left off and were not visited yet.


Data Set in parent child relationship
[
{
"id": 0,
"children": [
{
"id": 3,
"parentId": 0,
"children": [
{
"id": 6,
"parentId": 3,
"children": [
{
"id": 11,
"parentId": 6,
"children": [
{
"id": 10,
"parentId": 11,
"children": [
{
"id": 8,
"parentId": 10,
}
]
}
]
},
{
"id": 9,
"parentId": 6,
"children": [
{
"id": 1,
"parentId": 9,
"children": [
{
"id": 7,
"parentId": 1,
}
]
}
]
},
{
"id": 4,
"parentId": 6,
}
]
}
]
}
]
}
]

let result = [];
const handleTree = ( tree, count) => {
count = count || 0
const tree = _.clone(data);
if( tree ){
tree.forEach( ( t: any, i: string | number ) => {
let deepCopy = _.clone({...t });
delete deepCopy.children;
const { id, parentId } = deepCopy
result.push({ id, isVisited: true, parentId });
if( tree[i].children ){
handleTree(tree[i].children, count+1 )
}else{
//Completed start reading backward
// const getPreviousParent = findParentDetails(tree[i].parentId )

}
})
}
}



How to approach this problem?
So far I have been able to read the data in the same direction but, getting some unexpected results while going backward.


I tried using this code but backtrace I am not getting accurate results.
const handleTree = (tree, path = [], visited = new Set() ) => {
let result = [];
let count = 0;
let visitTree = tree
if( tree && tree.length > 0 ){
const tree2 = (tree) => {
if (tree) {

tree.forEach((t, i) => {
count += 1;
let { children, id, parentId, index, ...rest } = t
result.push({ ...t, id, parentId, isVisited: true, sid: count });
tree = updateIsVisited( tree, id, parentId )
path?.push( t.id );
if (t.children) {
tree2(t.children.sort( ( a: any, b: any ) => b.order - a.order ) );
} else {

tree = updateIsVisited( tree, id, parentId )
path.pop();
const res = returnReverseNodesForTraversel( [...path], tree, t.id );
// Here data is not coming correctly
}
});
}
}
return tree2(tree)
}
};



Function For updating status
const updateIsVisited = ( nodesData, id ) => {

return nodesData.map ( ( node: any ) => {
const updatedNode = {
...node,
isVisited: node.id === id ? true : node.isVisited,
children: Array.isArray( node.children )
? updateIsVisitedInNestedObjects( node.children, id )
: []
}
return updatedNode;
})
}



I hope I have explained the question well and it is making sense. Suggestions are welcomed.
  • Share This:  
  •  Facebook
  •  Twitter
  •  Google+
  •  Stumble
  •  Digg
Email ThisBlogThis!Share to XShare to Facebook
Newer Post Older Post Home

0 comments:

Post a Comment

Thanks

Meta

Popular Posts

  • Vue.js Events
      In Vue.js, Events are used to respond to an action. Suppose, you have to build a dynamic website using Vue.js then you'll most likely ...
  • Spring Security PreAuthorize using multi-value enum
    I have a annotation that is declared as follows. @Retention(RetentionPolicy.RUNTIME) @Target(ElementType.METHOD) @PreAuthorize("hasA...
  • Running PHPStan on max with Laravel
      Over the last few years static analysis in PHP, and more specifically Laravel, has become more and more popular. With more people adopting...
  • Generalization
    Generalization Generalization is like a bottom-up approach in which two or more entities of lower-level levels combine to form a higher-leve...
  • WordPress vs. Wix
      WordPress vs. Wix WordPress and Wix are both used to create a website, but they have entirely different website creation approaches. WordP...

Categories

  • Ajax (26)
  • Bootstrap (30)
  • DBMS (42)
  • HTML (12)
  • HTML5 (45)
  • JavaScript (10)
  • Jquery (34)
  • Jquery UI (2)
  • JqueryUI (32)
  • Laravel (1017)
  • Laravel Tutorials (23)
  • Laravel-Question (6)
  • Magento (9)
  • Magento 2 (95)
  • MariaDB (1)
  • MySql Tutorial (2)
  • PHP-Interview-Questions (3)
  • Php Question (13)
  • Python (36)
  • RDBMS (13)
  • SQL Tutorial (79)
  • Vue.js Tutorial (69)
  • Wordpress (150)
  • Wordpress Theme (3)
  • codeigniter (108)
  • oops (4)
  • php (853)

Social Media Links

  • Follow on Twitter
  • Like on Facebook
  • Subscribe on Youtube
  • Follow on Instagram

Pages

  • Home
  • Contact Us
  • Privacy Policy
  • About us

Blog Archive

  • July (4)
  • September (100)
  • August (50)
  • July (56)
  • June (46)
  • May (59)
  • April (50)
  • March (60)
  • February (42)
  • January (53)
  • December (58)
  • November (61)
  • October (39)
  • September (36)
  • August (36)
  • July (34)
  • June (34)
  • May (36)
  • April (29)
  • March (82)
  • February (1)
  • January (8)
  • December (14)
  • November (41)
  • October (13)
  • September (5)
  • August (48)
  • July (9)
  • June (6)
  • May (119)
  • April (259)
  • March (122)
  • February (368)
  • January (33)
  • October (2)
  • July (11)
  • June (29)
  • May (25)
  • April (168)
  • March (93)
  • February (60)
  • January (28)
  • December (195)
  • November (24)
  • October (40)
  • September (55)
  • August (6)
  • July (48)
  • May (2)
  • January (2)
  • July (6)
  • June (6)
  • February (17)
  • January (69)
  • December (122)
  • November (56)
  • October (92)
  • September (76)
  • August (6)

Loading...

Laravel News

Loading...

Copyright © CoderFunda | Powered by Blogger
Design by Coderfunda | Blogger Theme by Coderfunda | Distributed By Coderfunda