Display the elements of an object in a sequential order

Question

Display the elements of an object in a sequential order

Display the elements of an object. Ex.

const employees = {
    "Jacobs": ["Emiel", "Svjetlana", "Ivanna"],
    "Ivanna": ["Michael", "Lawson"],
    "Emiel": ["John", "Ruby"],    
    "Lawson": [],
    "Michael": ["Lindsay", "Ferguson"],
    "Ferguson": []
}

In the example above, let's assume that "Jacobs" is the parent of "Emiel", "Svjetlana", and "Ivanna". We need to print the sequence "Jacobs", "Emiel", "Svjetlana", "Ivanna", which means first the parent followed by the children.

Output should be: 
"Jacobs" 
"Emiel"
"Svjetlana"
"Ivanna"
"Emiel"
"John"
"Ruby"
"Ivanna"
"Michael"
"Lawson"
"Michael"
"Lindsay"
"Ferguson"

javascript arrays object arrayobject

Answer 1

Answer №1

const employees = {
  "Jacobs": ["Emiel", "Svjetlana", "Ivanna"],
  "Ivanna": ["Michael", "Lawson"],
  "Emiel": ["John", "Ruby"],
  "Lawson": [],
  "Michael": ["Lindsay", "Ferguson"],
  "Ferguson": []
}

const empArr = Object.entries(employees)
const empParents = Object.keys(employees)
const firstChildren = empArr.map(arr =>
  arr[1][0]
)
let remainingParents = empParents.filter(item => item !== empParents[0]);

const result = empArr.reduce((acc) => {
  const firstChild = acc.firstChild;
  // if has children add it and its children
  if (employees[firstChild] ?.length > 0) {
    remainingParents = remainingParents.filter(item => item !== firstChild);
    return {
      res: [...acc.res, firstChild, ...employees[firstChild]],
      firstChild: employees[firstChild][0]
    }
  } else {
    // if has no children move on to the item which has not already been added and is not the first child of any item
    const newParent = remainingParents.find(pName => !firstChildren.includes(pName))
    remainingParents = remainingParents.filter(item => item !== newParent)
    if (employees[newParent]) {
      const newParentData = employees[newParent].length > 0 ? [newParent, ...employees[newParent]] : []
      const firstChildData = typeof employees[firstChild] !== "undefined" ? [firstChild] : []
      const newFirstChild = employees[newParent][0];
      return {
        res: [...acc.res, ...newParentData, ...firstChildData],
        firstChild: newFirstChild
      }
    } else
      return acc
  }
}, {
  res: [
    empParents[0], ...employees[empParents[0]]
  ],
  firstChild: employees[empParents[0]][0]
})
result.res.map(item=>console.log(`"${item}"`))

Answer 2

const employees = {
  "Jacobs": ["Emiel", "Svjetlana", "Ivanna"],
  "Ivanna": ["Michael", "Lawson"],
  "Emiel": ["John", "Ruby"],
  "Lawson": [],
  "Michael": ["Lindsay", "Ferguson"],
  "Ferguson": []
}

const empArr = Object.entries(employees)
const empParents = Object.keys(employees)
const firstChildren = empArr.map(arr =>
  arr[1][0]
)
let remainingParents = empParents.filter(item => item !== empParents[0]);

const result = empArr.reduce((acc) => {
  const firstChild = acc.firstChild;
  // if has children add it and its children
  if (employees[firstChild] ?.length > 0) {
    remainingParents = remainingParents.filter(item => item !== firstChild);
    return {
      res: [...acc.res, firstChild, ...employees[firstChild]],
      firstChild: employees[firstChild][0]
    }
  } else {
    // if has no children move on to the item which has not already been added and is not the first child of any item
    const newParent = remainingParents.find(pName => !firstChildren.includes(pName))
    remainingParents = remainingParents.filter(item => item !== newParent)
    if (employees[newParent]) {
      const newParentData = employees[newParent].length > 0 ? [newParent, ...employees[newParent]] : []
      const firstChildData = typeof employees[firstChild] !== "undefined" ? [firstChild] : []
      const newFirstChild = employees[newParent][0];
      return {
        res: [...acc.res, ...newParentData, ...firstChildData],
        firstChild: newFirstChild
      }
    } else
      return acc
  }
}, {
  res: [
    empParents[0], ...employees[empParents[0]]
  ],
  firstChild: employees[empParents[0]][0]
})
result.res.map(item=>console.log(`"${item}"`))

Answer 3

Answer №2

Below is the code snippet you can utilize:

const employees = {
    "Smith": ["Alice", "Bob", "Charlie"],
    "Alice": ["David", "Emma"],
    "Bob": ["Frank"],
    "Charlie": [],
    "David": ["Grace", "Hannah"],
    "Hannah": []
}

function display(obj) {
    for(let key in obj) {
        console.log(key);
        obj[key].forEach(value => console.log(value));
    }
}

display(employees);

Answer 4

Below is the code snippet you can utilize:

const employees = {
    "Smith": ["Alice", "Bob", "Charlie"],
    "Alice": ["David", "Emma"],
    "Bob": ["Frank"],
    "Charlie": [],
    "David": ["Grace", "Hannah"],
    "Hannah": []
}

function display(obj) {
    for(let key in obj) {
        console.log(key);
        obj[key].forEach(value => console.log(value));
    }
}

display(employees);

Display the elements of an object in a sequential order

Answer №1

Answer №2

Similar questions

How can I retrieve the name of the upcoming middleware function in Express.JS?

Creating a JSON hierarchy from an adjacency list

Importing classes in ECMAScript 6 does not work properly, causing issues when running scripts

Send the checkbox value using ajax, jquery, and php

Locate a specific value within an array of objects and display it

What could be causing the undefined status of this length function?

Synchronizing multiple file changes simultaneously in Node.js

Chrome and Firefox provide excellent compatibility for running JavaScript, whereas Safari may encounter some issues. Opera's performance with JavaScript can be quirky

Chip input component in React

Rotating an image as it approaches the footer: a step-by-step guide

The lifecycle of a React state in a filtering component

Saving data for editing on a Laravel page can be achieved by leveraging the powerful features

Turn off the feature that prohibits the use of variables before they are

execute javascript code after loading ajax content

Obtain an Instance of a Class Using a Decorator

Switch Tabs with Dropdown Selection

Leveraging window.hash and the power of WordPress htaccess

Error: Unable to access the 'nom_gr' property of null - encountered in Chrome

What is the method for accessing a local XML file with $.ajax?

What is the best way to implement a promise function in this scenario using JavaScript?