Removing the main node from the tree of structured information

Question

Removing the main node from the tree of structured information

I have retrieved a list of menus from the database, labeled "sample," shown below:

[
  { id: 1, name: 'Main Menu', branch: 1, subbranch1: 0, subbranch2: 0 },
  { id: 2, name: 'Main Menu 2', branch: 2, subbranch1: 0, subbranch2: 0 },
  { id: 3, name: 'Sub Menu 1-1', branch: 1, subbranch1: 1, subbranch2: 0 },
  { id: 4, name: 'Sub Menu 1-2', branch: 1, subbranch1: 2, subbranch2: 0 },
  { id: 5, name: 'Sub Menu 1-2-1', branch: 1, subbranch1: 2, subbranch2: 1 },
  { id: 6, name: 'Sub Menu 2-1', branch: 2, subbranch1: 1, subbranch2: 0 },
  { id: 7, name: 'Sub Menu 2-2', branch: 2, subbranch1: 2, subbranch2: 0 },
]

Each menu in this list is assigned values for branch, subbranch1, and subbranch2 which determine its position in the menu hierarchy. A menu can act as a clickable item or serve as a group heading for other menus (essentially acting as a parent).

For instance, Menu with id 1 has submenus 3 and 4 under it as subbranch1, and Menu with id 4 has submenu 5 under it as subbranch2.

I am seeking to identify all the menus that do not have any children (in other words, they are clickable menus rather than group menus).

The final result for the "given sample" should be:

 [
  { id: 3, name: 'Sub Menu 1-1', branch: 1, subbranch1: 1, subbranch2: 0 },
  { id: 5, name: 'Sub Menu 1-2-1', branch: 1, subbranch1: 2, subbranch2: 1 },
  { id: 6, name: 'Sub Menu 2-1', branch: 2, subbranch1: 1, subbranch2: 0 },
  { id: 7, name: 'Sub Menu 2-2', branch: 2, subbranch1: 2, subbranch2: 0 },
]

javascript json higher-order-functions

Answer 1

Answer №1

To obtain the deepest nodes, start by creating the tree structure and then extract only the nodes located at the maximum depth.

Create the tree
- Compile all level keys into an array for easy iteration.
- Traverse through all nodes and construct nested objects for each nested node discovered.
- Assign the node to the property _.
Identify deepest nodes
- Retrieve the keys of the object.
- Iterate through the keys.
  - Check if the key is _, then exit the current iteration.
  - Determine if the property contains a single key and that the key is _; this indicates the deepest node has been found. Extract the underscore property for the node collection and break out of the loop.
  - If not, attempt to locate the deepest node within the current key.
Provide the final result.

function getDeepestNodes(nodes) {

    function getDeepest(node) {
        Object.keys(node).forEach(function (key) {
            if (key === '_') {
                return;
            }
            if (Object.keys(node[key]).length === 1 && '_' in node[key]) {
                result.push(node[key]._);
                return;
            }
            getDeepest(node[key]);
        });
    }

    var levels = ['branch', 'subbranch1', 'subbranch2'],
        tree = Object.create(null),
        result = [];

    nodes.forEach(function (node) {
        var temp = tree;
        levels.every(function (level, i, ll) {
            temp[node[level]] = temp[node[level]] || {};
            temp = temp[node[level]]
            return node[ll[i + 1]];
        });
        temp._ = node;
    });

    getDeepest(tree);

    return result;
}

var data = [{ id: 1, name: 'Main Menu', branch: 1, subbranch1: 0, subbranch2: 0 }, { id: 2, name: 'Main Menu 2', branch: 2, subbranch1: 0, subbranch2: 0 }, { id: 3, name: 'Sub Menu 1-1', branch: 1, subbranch1: 1, subbranch2: 0 }, { id: 4, name: 'Sub Menu 1-2', branch: 1, subbranch1: 2, subbranch2: 0 }, { id: 5, name: 'Sub Menu 1-2-1', branch: 1, subbranch1: 2, subbranch2: 1 }, { id: 6, name: 'Sub Menu 2-1', branch: 2, subbranch1: 1, subbranch2: 0 }, { id: 7, name: 'Sub Menu 2-2', branch: 2, subbranch1: 2, subbranch2: 0 }],
    result = getDeepestNodes(data);

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 2

To obtain the deepest nodes, start by creating the tree structure and then extract only the nodes located at the maximum depth.

Create the tree
- Compile all level keys into an array for easy iteration.
- Traverse through all nodes and construct nested objects for each nested node discovered.
- Assign the node to the property _.
Identify deepest nodes
- Retrieve the keys of the object.
- Iterate through the keys.
  - Check if the key is _, then exit the current iteration.
  - Determine if the property contains a single key and that the key is _; this indicates the deepest node has been found. Extract the underscore property for the node collection and break out of the loop.
  - If not, attempt to locate the deepest node within the current key.
Provide the final result.

function getDeepestNodes(nodes) {

    function getDeepest(node) {
        Object.keys(node).forEach(function (key) {
            if (key === '_') {
                return;
            }
            if (Object.keys(node[key]).length === 1 && '_' in node[key]) {
                result.push(node[key]._);
                return;
            }
            getDeepest(node[key]);
        });
    }

    var levels = ['branch', 'subbranch1', 'subbranch2'],
        tree = Object.create(null),
        result = [];

    nodes.forEach(function (node) {
        var temp = tree;
        levels.every(function (level, i, ll) {
            temp[node[level]] = temp[node[level]] || {};
            temp = temp[node[level]]
            return node[ll[i + 1]];
        });
        temp._ = node;
    });

    getDeepest(tree);

    return result;
}

var data = [{ id: 1, name: 'Main Menu', branch: 1, subbranch1: 0, subbranch2: 0 }, { id: 2, name: 'Main Menu 2', branch: 2, subbranch1: 0, subbranch2: 0 }, { id: 3, name: 'Sub Menu 1-1', branch: 1, subbranch1: 1, subbranch2: 0 }, { id: 4, name: 'Sub Menu 1-2', branch: 1, subbranch1: 2, subbranch2: 0 }, { id: 5, name: 'Sub Menu 1-2-1', branch: 1, subbranch1: 2, subbranch2: 1 }, { id: 6, name: 'Sub Menu 2-1', branch: 2, subbranch1: 1, subbranch2: 0 }, { id: 7, name: 'Sub Menu 2-2', branch: 2, subbranch1: 2, subbranch2: 0 }],
    result = getDeepestNodes(data);

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 3

Answer №2

This intricate nested loop testing structure presents a challenge. Simplifying the process would involve each line referencing the id of its immediate parent menu, making iteration and testing much easier. The assumed menu structure is as follows:

+-------------+
|  Main Menu  |
+-------------+
  +--------------+
  | Sub Menu 1-1 |
  +--------------+
  | Sub Menu 1-2 |
  +--------------+
    +----------------+
    | Sub Menu 1-2-1 |
    +----------------+
+-------------+
| Main Menu 2 |
+-------------+
  +--------------+
  | Sub Menu 2-1 |
  +--------------+
  | Sub Menu 2-2 |
  +--------------+

To tackle this issue, a possible solution could be implemented like so:

old=<original array>
new= new array()
for (z=0;z<old.length;z++) // Iterating through each line
{
    linkonly = 1 // To prevent multiple 
    if (old[z].subbranch2 == 0) // No sub menu for 3rd level
    {
        for (y=0;y<old.length;y++) // Iterating through each line
        {
            if (z!=y )  // Avoid checking against itself
            {
                if (old[z].branch == old[y].branch) // Matching main branches
                {
                    if (old[z].subbranch1 != 0) // If submenu, continue
                    {
                        if (old[z].subbranch1 == old[y].subbranch1) // Same submenu section
                        {
                            if (old[y].subbranch2 != 0) // Submenu of tested parent
                            {
                                linkonly = 0
                                y=old.length
                            }
                        }
                    }else{
                        if (old[y].subbranch1 != 0) // Submenu of tested item
                            linkonly = 0
                            y=old.length
                        {
                    }
                }
            }
        }
    }
    if (linkonly == 1)
    {
        // push line into new array
    }
}
// utilize new array

A more effective approach would be to transform the initial data structure into something like this:

[
  { id: 1, name: 'Main Menu', parent:0, pos:1 },
  { id: 2, name: 'Main Menu 2', parent:0, pos:2 },
  { id: 3, name: 'Sub Menu 1-1', parent:1, pos:1 },
  { id: 4, name: 'Sub Menu 1-2', parent:0, pos:2 },
  { id: 5, name: 'Sub Menu 1-2-1', parent:4, pos:1 },
  { id: 6, name: 'Sub Menu 2-1', parent:2, pos:1 },
  { id: 7, name: 'Sub Menu 2-2', parent:2, pos:2 },
]

This structure enables testing like this:

old=<original array>
new= new array()
for (z=0;z<old.length;z++) // Looping through each line
{
    linkonly=1
    for (y=0;y<old.length;y++) // Looping through each line
    {
        if (x!=y) // Avoid self-testing
        {
            if (old[y].parent == old[x].id)
            {
                linkonly=0
                y=old.length
            }
        }
    }
    if (linkonly == 1)
    {
        // push line into new array
    }
}
// utilize new array

An alternate method involves loading lines in a multi-dimensional array and iterating through them to identify the presence of sub menus by analyzing the sub-array.

Answer 4

This intricate nested loop testing structure presents a challenge. Simplifying the process would involve each line referencing the id of its immediate parent menu, making iteration and testing much easier. The assumed menu structure is as follows:

+-------------+
|  Main Menu  |
+-------------+
  +--------------+
  | Sub Menu 1-1 |
  +--------------+
  | Sub Menu 1-2 |
  +--------------+
    +----------------+
    | Sub Menu 1-2-1 |
    +----------------+
+-------------+
| Main Menu 2 |
+-------------+
  +--------------+
  | Sub Menu 2-1 |
  +--------------+
  | Sub Menu 2-2 |
  +--------------+

To tackle this issue, a possible solution could be implemented like so:

old=<original array>
new= new array()
for (z=0;z<old.length;z++) // Iterating through each line
{
    linkonly = 1 // To prevent multiple 
    if (old[z].subbranch2 == 0) // No sub menu for 3rd level
    {
        for (y=0;y<old.length;y++) // Iterating through each line
        {
            if (z!=y )  // Avoid checking against itself
            {
                if (old[z].branch == old[y].branch) // Matching main branches
                {
                    if (old[z].subbranch1 != 0) // If submenu, continue
                    {
                        if (old[z].subbranch1 == old[y].subbranch1) // Same submenu section
                        {
                            if (old[y].subbranch2 != 0) // Submenu of tested parent
                            {
                                linkonly = 0
                                y=old.length
                            }
                        }
                    }else{
                        if (old[y].subbranch1 != 0) // Submenu of tested item
                            linkonly = 0
                            y=old.length
                        {
                    }
                }
            }
        }
    }
    if (linkonly == 1)
    {
        // push line into new array
    }
}
// utilize new array

A more effective approach would be to transform the initial data structure into something like this:

[
  { id: 1, name: 'Main Menu', parent:0, pos:1 },
  { id: 2, name: 'Main Menu 2', parent:0, pos:2 },
  { id: 3, name: 'Sub Menu 1-1', parent:1, pos:1 },
  { id: 4, name: 'Sub Menu 1-2', parent:0, pos:2 },
  { id: 5, name: 'Sub Menu 1-2-1', parent:4, pos:1 },
  { id: 6, name: 'Sub Menu 2-1', parent:2, pos:1 },
  { id: 7, name: 'Sub Menu 2-2', parent:2, pos:2 },
]

This structure enables testing like this:

old=<original array>
new= new array()
for (z=0;z<old.length;z++) // Looping through each line
{
    linkonly=1
    for (y=0;y<old.length;y++) // Looping through each line
    {
        if (x!=y) // Avoid self-testing
        {
            if (old[y].parent == old[x].id)
            {
                linkonly=0
                y=old.length
            }
        }
    }
    if (linkonly == 1)
    {
        // push line into new array
    }
}
// utilize new array

An alternate method involves loading lines in a multi-dimensional array and iterating through them to identify the presence of sub menus by analyzing the sub-array.

Answer 5

Answer №3

  function determineClickableMenu(menu, menus){
    let branchCount;
    let subbranch1Count;
    if(menu.subbranch1 === 0){
      branchCount = menus.reduce((acc,m)=>{
        return m.branch === menu.branch ? acc + 1 : acc;
       },0);
      return branchCount === 1;
    }
    if(menu.subbranch2 === 0){
       subbranch1Count = menus.reduce((acc, m)=>{
          return (m.subbranch1 === menu.subbranch1 && m.branch === menu.branch) ? acc + 1 : acc;
       }, 0);
       return subbranch1Count === 1;
    }
    return true
  }

  function findClickableMenus(menus){
    const clickableArray = [];
    for (let i = 0; i < menus.length; i++) {
      if(determineClickableMenu(menus[i], menus)){
       clickableArray.push(menus[i]);
      }
    }
    return clickableArray;
  }
  
  const menus = [
    { id: 1, name: 'Main Menu', branch: 1, subbranch1: 0, subbranch2: 0 },
    { id: 2, name: 'Main Menu 2', branch: 2, subbranch1: 0, subbranch2: 0 },
    { id: 3, name: 'Sub Menu 1-1', branch: 1, subbranch1: 1, subbranch2: 0 },
    { id: 4, name: 'Sub Menu 1-2', branch: 1, subbranch1: 2, subbranch2: 0 },
    { id: 5, name: 'Sub Menu 1-2-1', branch: 1, subbranch1: 2, subbranch2: 1 },
    { id: 6, name: 'Sub Menu 2-1', branch: 2, subbranch1: 1, subbranch2: 0 },
    { id: 7, name: 'Sub Menu 2-2', branch: 2, subbranch1: 2, subbranch2: 0 },
  ];
  
  console.log(findClickableMenus(menus));

Great solution uncovered!.. possibly some fine-tuning can be done for optimization

Answer 6

  function determineClickableMenu(menu, menus){
    let branchCount;
    let subbranch1Count;
    if(menu.subbranch1 === 0){
      branchCount = menus.reduce((acc,m)=>{
        return m.branch === menu.branch ? acc + 1 : acc;
       },0);
      return branchCount === 1;
    }
    if(menu.subbranch2 === 0){
       subbranch1Count = menus.reduce((acc, m)=>{
          return (m.subbranch1 === menu.subbranch1 && m.branch === menu.branch) ? acc + 1 : acc;
       }, 0);
       return subbranch1Count === 1;
    }
    return true
  }

  function findClickableMenus(menus){
    const clickableArray = [];
    for (let i = 0; i < menus.length; i++) {
      if(determineClickableMenu(menus[i], menus)){
       clickableArray.push(menus[i]);
      }
    }
    return clickableArray;
  }
  
  const menus = [
    { id: 1, name: 'Main Menu', branch: 1, subbranch1: 0, subbranch2: 0 },
    { id: 2, name: 'Main Menu 2', branch: 2, subbranch1: 0, subbranch2: 0 },
    { id: 3, name: 'Sub Menu 1-1', branch: 1, subbranch1: 1, subbranch2: 0 },
    { id: 4, name: 'Sub Menu 1-2', branch: 1, subbranch1: 2, subbranch2: 0 },
    { id: 5, name: 'Sub Menu 1-2-1', branch: 1, subbranch1: 2, subbranch2: 1 },
    { id: 6, name: 'Sub Menu 2-1', branch: 2, subbranch1: 1, subbranch2: 0 },
    { id: 7, name: 'Sub Menu 2-2', branch: 2, subbranch1: 2, subbranch2: 0 },
  ];
  
  console.log(findClickableMenus(menus));

Great solution uncovered!.. possibly some fine-tuning can be done for optimization

Removing the main node from the tree of structured information

Answer №1

Answer №2

Answer №3

Similar questions

Converting to JSON format by utilizing MemoryStream and including line breaks in C#

Managing the orientation of the print grid panel in ext.net

Exploring the Functionality of Chaining in JQuery and Understanding its Inner Workings

Optimizing JSON Data Structure Efficiency: Best Practices for Converting JSON to Objects

Even after being removed from the DOM using Ajax load, JQuery continues to execute

I am experiencing difficulty with jQuery connecting to the elements on my server-generated webpage

Initiate the function one time

Creating a dynamic configuration for service instantiation in Angular 4/5

AngularJS - ng-repeat not updating when property array changes

What is the method in MySQL to convert a VARCHAR to an UNSIGNED type within a JSON_OBJECT?

What is the best way to update the page based on the user input from a prompt?

What is the best method for generating a large number of Express.js routes quickly and efficiently?

Issue with generating JSON response in CakePHP version 2.x

Create engaging animations using JavaScript to draw moving circles on an

Problem encountered in NextJS/ReactJS when attempting to dynamically load a new component by clicking a button within the current component

Tips for sending a JSON object with an embedded array

The operation could not be completed with exit code 1: executing next build on Netlify platform

How to use Yii2 to trigger a controller action from a view and effectively debug the

Experiencing difficulties when establishing a connection between MongoDB and Node.js

Best practices for efficiently utilizing setInterval with multiple HTTP requests in NodeJS