Guidance on dividing children in an object into distinct arrays

Question

Guidance on dividing children in an object into distinct arrays

So I have an interesting challenge while working on my project. I need help figuring out how to split a Javascript Object like the one below:

{
    field1: {
        field2: {
            field3: "value 1",
            field4: "value 2"
        }
    }
}

My goal is to separate any field with multiple keys into different arrays, as shown here:

[
    {
        field1: {
            field2: {
                field3: "value 1"
            }
        }
    },
    {
        field1: {
            field2: {
                field4: "value 2"
            }
        }
    }
]

I've attempted to create recursive functions to navigate through the object structure and duplicate any object value with more than one key. Each "child" should have its own parent structure. I feel like there might be a simple solution that I'm missing, so any suggestions would be greatly appreciated!

Thank you for your help.

javascript arrays json object

Answer 1

Answer №1

Here is a quick demo using your initial data.

However, additional test scenarios with valid results are necessary for thorough verification (as things can quickly go haywire).

const sampleInput = {
  item1: {
    item2: {
      item3: "data value 1",
      item4: "data value 2"
    }
  }
};

function flattenRecursively(data) {
  const output = [];

  for (const [key, value] of Object.entries(data)) {
    if (value && typeof value === 'object' && Object.entries(value).length) {
      for (const obj of flattenRecursively(value)) {
        output.push({ [key]: obj });
      }
    }
    else {
      output.push({ [key]: value });
    }
  }

  return output;
}

console.log(flattenRecursively(sampleInput));

Additional Examples:

function flattenRecursively(data) { const output = []; for (const [key, value] of Object.entries(data)) { if (value && typeof value === 'object' && Object.entries(value).length) { for (const obj of flattenRecursively(value)) { output.push({ [key]: obj }); } } else { output.push({ [key]: value }); } } return output; }

// Test Input 1
const inputData1 = {
  item1: {
    item2: {
      item3: "data value 1",
      item4: "data value 2"
    }
  },
  item5: {
    item6: {
      item7: "data value 3"
    },
    item8: {
      item9: "data value 4"
    }
  }
};

console.log(flattenRecursively(inputData1));

// Test Input 2
const inputData2 = {
  item1: {
    item2: {
      item3: {
        subItem1: 'subValue1',
        subItem2: 'subValue2',
      },
      item4: "data value 2"
    }
  }
};

console.log(flattenRecursively(inputData2));

Answer 2

Here is a quick demo using your initial data.

However, additional test scenarios with valid results are necessary for thorough verification (as things can quickly go haywire).

const sampleInput = {
  item1: {
    item2: {
      item3: "data value 1",
      item4: "data value 2"
    }
  }
};

function flattenRecursively(data) {
  const output = [];

  for (const [key, value] of Object.entries(data)) {
    if (value && typeof value === 'object' && Object.entries(value).length) {
      for (const obj of flattenRecursively(value)) {
        output.push({ [key]: obj });
      }
    }
    else {
      output.push({ [key]: value });
    }
  }

  return output;
}

console.log(flattenRecursively(sampleInput));

Additional Examples:

function flattenRecursively(data) { const output = []; for (const [key, value] of Object.entries(data)) { if (value && typeof value === 'object' && Object.entries(value).length) { for (const obj of flattenRecursively(value)) { output.push({ [key]: obj }); } } else { output.push({ [key]: value }); } } return output; }

// Test Input 1
const inputData1 = {
  item1: {
    item2: {
      item3: "data value 1",
      item4: "data value 2"
    }
  },
  item5: {
    item6: {
      item7: "data value 3"
    },
    item8: {
      item9: "data value 4"
    }
  }
};

console.log(flattenRecursively(inputData1));

// Test Input 2
const inputData2 = {
  item1: {
    item2: {
      item3: {
        subItem1: 'subValue1',
        subItem2: 'subValue2',
      },
      item4: "data value 2"
    }
  }
};

console.log(flattenRecursively(inputData2));

Guidance on dividing children in an object into distinct arrays

Answer №1

Similar questions

Save a PNG file using the HTML5 Canvas when the Submit button is clicked, with the help of PHP

Is the JSON returned by WCF Data Services incorrect?

What is the best way to implement CSS in this JavaScript Fetch code in order to manipulate the text's position and font style

Is there a way to generate a checkerboard dynamically with the help of jQuery?

Authenticating the identity of the client application - the client is currently within the browser

Combine two scope arrays in AngularJS

Enhance your Vue PWA by utilizing ServiceWorker to efficiently cache remote media assets fetched from an array of URLs

Webdriverio: exploring the window object

Parsing JSON with PHP when dealing with an array that is not consistent

Creating a Higher Order Component (HOC) for your Next.js page

HtmlWebpackPlugin can cause issues with loading relative path files on websites that are not located in the root directory

Tips for successfully passing multiple properties to a function in React

Vue2: when passing a function as a prop, a warning will be triggered indicating that the prop has

When the time comes, ReactDOM will render your element into the designated container,

Decode JSON data from an array using the HTTParty gem in Ruby

Enhancing table field functionality in Backbone.js

Tips for retrieving page source with selenium Remote Control

Acquiring the safe area of the iPhone X through JavaScript

What is the best way to assign attributes to multiple HTML elements using an array?

"Step-by-step guide on assigning a class to a Component that has been