Gather all possible routes within the JSON structure

Question

Gather all possible routes within the JSON structure

I am faced with a JavaScript object that contains various data:

{
    "gender": "man",
    "jobinfo": {
        "type": "teacher"
    },
    "children": [
        {
            "name": "Daniel",
            "age": 12,
            "pets": [
                {
                    "type": "cat", 
                    "name": "Willy",
                    "age": 2
                },
                {
                    "type": "dog", 
                    "name": "Jimmie",
                    "age": 5
                }
            ]
        }
    ]
}

My goal is to list out all the paths (keys and array indices) within the object, including their respective parents (e.g., children should be included along with its contents).

gender
jobinfo,
jobinfo.type,
children,
children.0.name,
children.0.age,
children.0.pets,
children.0.pets.0.type,
children.0.pets.0.name,
children.0.pets.0.age,
children.0.pets.1.type,
children.0.pets.1.name,
children.0.pets.1.age

I attempted to write a code for this purpose but encountered issues:

function getPath(object) {
    for (key in object) {
        if (Array.isArray(object[key]) === true) {
            console.log(key)
            getPath(object[key])
        } else if (typeof object[key] === 'object') {
            console.log(key)
            getPath(object[key])
        } else {
            console.log(key)
        }
    }
}

While this code does display all keys in the JSON object, I am finding it challenging to concatenate the paths, particularly in nested elements.

javascript arrays json object path

Answer 1

Answer №1

With this updated version, the code now efficiently handles array keys containing numbers such as 'children.0', providing the desired output:

const data = {"gender":"woman","jobinfo":{"type":"engineer"},"children":[{"name":"Sophia","age":10,"pets":[{"type":"bird","name":"Polly","age":3},{"type":"rabbit","name":"Bunny","age":4}]}]};

function extractPath(obj, path) {
  for (let prop in obj) {
    let currentPath = path ? `${path}.${prop}` : prop;

    if (Array.isArray(obj[prop])) {
      console.log(currentPath);
      extractPath(obj[prop], currentPath);
    } else if (typeof obj[prop] === 'object') {
      if (!Array.isArray(obj)) { // exclude logging array keys like children.0
        console.log(currentPath);
      }
      extractPath(obj[prop], currentPath);
    } else {
      console.log(currentPath);
    }
  }
}

extractPath(data);

Answer 2

With this updated version, the code now efficiently handles array keys containing numbers such as 'children.0', providing the desired output:

const data = {"gender":"woman","jobinfo":{"type":"engineer"},"children":[{"name":"Sophia","age":10,"pets":[{"type":"bird","name":"Polly","age":3},{"type":"rabbit","name":"Bunny","age":4}]}]};

function extractPath(obj, path) {
  for (let prop in obj) {
    let currentPath = path ? `${path}.${prop}` : prop;

    if (Array.isArray(obj[prop])) {
      console.log(currentPath);
      extractPath(obj[prop], currentPath);
    } else if (typeof obj[prop] === 'object') {
      if (!Array.isArray(obj)) { // exclude logging array keys like children.0
        console.log(currentPath);
      }
      extractPath(obj[prop], currentPath);
    } else {
      console.log(currentPath);
    }
  }
}

extractPath(data);

Answer 3

Answer №2

This method is successful:

const data = {"gender":"man","jobinfo":{"type":"teacher"},"children":[{"name":"Daniel","age":12,"pets":[{"type":"cat","name":"Willy","age":2},{"type":"dog","name":"Jimmie","age":5}]}]};

const getPath = (currPath, item) => {
  console.log(currPath);
  if (Array.isArray(item)) {
    item.forEach((el, idx) => getPath(`${currPath}.${idx}`, el));
  } else if (typeof item == "object") {
    Object.entries(item).forEach(([key, value]) => {
      getPath(`${currPath}.${key}`, value);
    });
  }
};

Object.entries(data).forEach(([key, value]) => {
  getPath(key, value);
});

Essentially, I iterate through each entry in the initial object by utilizing the key as the path at that particular stage while verifying whether the value is an array or object. The function consistently displays the path (to offer the desired outer layers) and proceeds to recursively process the inner layers, adjusting the path accordingly.

Answer 4

This method is successful:

const data = {"gender":"man","jobinfo":{"type":"teacher"},"children":[{"name":"Daniel","age":12,"pets":[{"type":"cat","name":"Willy","age":2},{"type":"dog","name":"Jimmie","age":5}]}]};

const getPath = (currPath, item) => {
  console.log(currPath);
  if (Array.isArray(item)) {
    item.forEach((el, idx) => getPath(`${currPath}.${idx}`, el));
  } else if (typeof item == "object") {
    Object.entries(item).forEach(([key, value]) => {
      getPath(`${currPath}.${key}`, value);
    });
  }
};

Object.entries(data).forEach(([key, value]) => {
  getPath(key, value);
});

Essentially, I iterate through each entry in the initial object by utilizing the key as the path at that particular stage while verifying whether the value is an array or object. The function consistently displays the path (to offer the desired outer layers) and proceeds to recursively process the inner layers, adjusting the path accordingly.

Gather all possible routes within the JSON structure

Answer №1

Answer №2

Similar questions

What is the best way to restart the clock in three.js?

"The interconnection between NetBeans, jQuery, and AJAX is

Best practices for refreshing the HTML5 offline application cache

Can you outline the distinctions between React Native and React?

I'm having trouble getting a http.request to run within an imported module. It just doesn't seem to work when I try to access

Using JSON data to populate the jQuery UI Datepicker

The result from Axios yields an [object Promise]

Utilize Gson in Kotlin to Parse JSON with Nested Objects

Wrapping an anchor tag with a div in Codeigniter

Creating a Circle with Pixi.js v4 and Typerscript in IONIC 2

Ways to retrieve accurate information from various arrays

Displaying data from a remote JSON source in a Swift tableView

Rotate through different image sources using jQuery in a circular pattern

Refresh the DATATABLE inside an AJAX call without reloading the entire page

Issue with hidden sourcemap not loading in Chrome or Firefox during Vite build

Searching with jQuery autocomplete and displaying the results within a div

Error encountered while executing ExpressJs function that was converted to a promise

Is there a way to use setTimeout in JavaScript to temporarily stop a map or loop over an array?

Tips for achieving expansion of solely the clicked item and not the whole row

Determine the element(s) that are the nearest to the mean value of the