Turn a one-dimensional array of arrays into a structure of nested objects

Question

Turn a one-dimensional array of arrays into a structure of nested objects

As a novice, I am trying to figure out how to convert an array of values into nested objects based on categories. If the category (i.e., 1st element) exists, then the subsequent subcategories should be nested within it. Can someone please assist me with achieving this goal?

For example:

    const newCat = [
                     [
                        "Grocery", // category
                        "Food & Drink", // sub-category
                        "Snacks, Crisps and Sweets", // sub-sub-category
                    ],
                    [
                        "Grocery",
                        "Canned, Dry & Packaged Food",
                        "Pickled Foods",
                    ],
                    [
                        "Grocery",
                        "Food & Drink",
                    ],
                    [
                        "Grocery",
                        "Food & Drink",
                        "Nuts, Dates & Dried Fruits",
                    ],
                    [
                        "Grocery",
                        "World Specialities",
                        "India",
                    ],

                  ]

OUTPUT -
[
    {
    CategoryName: "Grocery",
    SubCategories: [
      {
        CategoryName: "Food & Drink",
        SubCategories: [
          {
            CategoryName: "Snacks, Crisps, and Sweets",
          },
        ],
      },
      {
        CategoryName: "Canned, Dry & Packaged Food",
        SubCategories: [
          {
            CategoryName: "Pickled Foods",
          },

        ],

      },
    ],
  }
]

javascript arrays nested-object

Answer 1

Answer №1

function flattenNestedArray(arr) {
  const result = [];
  for (let item of arr) {
    const [c1, c2, c3] = item;
    const findC1 = result.find(c => c.categoryName === c1);
    if (findC1) {
      if (!c2) {
        continue;
      }
      const findC2 = findC1.subCategorys.find(c => c.categoryName === c2);
      if (findC2) {
        if (!c3) {
          continue;
        }
        findC2.subCategorys.push(c3);
      } else {
        findC1.subCategorys.push({
          categoryName: c2,
          subCategorys: [c3]
        });
      }
    } else {
      result.push({
        categoryName: c1,
        subCategorys: [
          {
            categoryName: c2,
            subCategorys: [c3]
          }
        ]
      })
    }
  }  
  
  return result;
}


// Test case
const nestedCategories = [
   [
      "Grocery", // category
      "Food & Drink", // sub-category
      "Snacks, Crisps and Sweets", // sub-sub-category
  ],
  [
      "Grocery",
      "Canned, Dry & Packaged Food",
      "Pickled Foods",
  ],
  [
      "Grocery",
      "Food & Drink",
  ],
  [
      "Grocery",
      "Food & Drink",
      "Nuts, Dates & Dried Fruits",
  ],
  [
      "Grocery",
      "World Specialities",
      "India",
  ],

];

console.log(flattenNestedArray(nestedCategories));

Answer 2

function flattenNestedArray(arr) {
  const result = [];
  for (let item of arr) {
    const [c1, c2, c3] = item;
    const findC1 = result.find(c => c.categoryName === c1);
    if (findC1) {
      if (!c2) {
        continue;
      }
      const findC2 = findC1.subCategorys.find(c => c.categoryName === c2);
      if (findC2) {
        if (!c3) {
          continue;
        }
        findC2.subCategorys.push(c3);
      } else {
        findC1.subCategorys.push({
          categoryName: c2,
          subCategorys: [c3]
        });
      }
    } else {
      result.push({
        categoryName: c1,
        subCategorys: [
          {
            categoryName: c2,
            subCategorys: [c3]
          }
        ]
      })
    }
  }  
  
  return result;
}


// Test case
const nestedCategories = [
   [
      "Grocery", // category
      "Food & Drink", // sub-category
      "Snacks, Crisps and Sweets", // sub-sub-category
  ],
  [
      "Grocery",
      "Canned, Dry & Packaged Food",
      "Pickled Foods",
  ],
  [
      "Grocery",
      "Food & Drink",
  ],
  [
      "Grocery",
      "Food & Drink",
      "Nuts, Dates & Dried Fruits",
  ],
  [
      "Grocery",
      "World Specialities",
      "India",
  ],

];

console.log(flattenNestedArray(nestedCategories));

Answer 3

Answer №2

const categories = [
  [
    "Grocery", // Main category
    "Food & Drink", // Sub-category
    "Snacks, Crisps and Sweets", // Sub-sub-category
  ],
  [
    "Grocery",
    "Canned, Dry & Packaged Food",
    "Pickled Foods",
  ],
  [
    "Grocery",
    "Food & Drink",
  ],
  [
    "Grocery",
    "Food & Drink",
    "Nuts, Dates & Dried Fruits",
  ],
  [
    "Grocery",
    "World Specialities",
    "India",
  ],
  ["Electronics", "Speakers", "Bluetooth Speakers", "JBL", ],
]

const outputCategories = []

categories.forEach((e) => {
  let indexOfMainCategory = outputCategories.findIndex((category) => category.CategoryName === e[0]);
  if (indexOfMainCategory === -1) {
    outputCategories.push({
      CategoryName: e[0],
      SubCategories: []
    })
    indexOfMainCategory = outputCategories.length - 1;
  }
  if (e[1]) {
    let indexOfSubcategory = outputCategories[indexOfMainCategory].SubCategories.findIndex((category) => category.CategoryName === e[1]);
    if (indexOfSubcategory === -1) {
      outputCategories[indexOfMainCategory].SubCategories.push({
        CategoryName: e[1],
        SubCategories: []
      })
      indexOfSubcategory = outputCategories[indexOfMainCategory].SubCategories.length - 1;
    }
    if (e[2]) {
      let indexOfSubSubcategory = outputCategories[indexOfMainCategory].SubCategories[indexOfSubcategory].SubCategories.findIndex((category) => category.CategoryName === e[2]);
      if (indexOfSubSubcategory === -1) {
        outputCategories[indexOfMainCategory].SubCategories[indexOfSubcategory].SubCategories.push({
          CategoryName: e[2],
          SubCategories: [],
        })
        indexOfSubSubcategory = outputCategories[indexOfMainCategory].SubCategories[indexOfSubcategory].SubCategories.length - 1;
      }
      if (e[3]) {
        const indexOfSubSubSubcategory = outputCategories[indexOfMainCategory].SubCategories[indexOfSubcategory].SubCategories[indexOfSubSubcategory].SubCategories.findIndex((category) => category.CategoryName === e[3]);
        if (indexOfSubSubSubcategory === -1) outputCategories[indexOfMainCategory].SubCategories[indexOfSubcategory].SubCategories[indexOfSubSubcategory].SubCategories.push({
          CategoryName: e[3]
        })
      }
    }
  }
});

console.log(outputCategories)

Answer 4

const categories = [
  [
    "Grocery", // Main category
    "Food & Drink", // Sub-category
    "Snacks, Crisps and Sweets", // Sub-sub-category
  ],
  [
    "Grocery",
    "Canned, Dry & Packaged Food",
    "Pickled Foods",
  ],
  [
    "Grocery",
    "Food & Drink",
  ],
  [
    "Grocery",
    "Food & Drink",
    "Nuts, Dates & Dried Fruits",
  ],
  [
    "Grocery",
    "World Specialities",
    "India",
  ],
  ["Electronics", "Speakers", "Bluetooth Speakers", "JBL", ],
]

const outputCategories = []

categories.forEach((e) => {
  let indexOfMainCategory = outputCategories.findIndex((category) => category.CategoryName === e[0]);
  if (indexOfMainCategory === -1) {
    outputCategories.push({
      CategoryName: e[0],
      SubCategories: []
    })
    indexOfMainCategory = outputCategories.length - 1;
  }
  if (e[1]) {
    let indexOfSubcategory = outputCategories[indexOfMainCategory].SubCategories.findIndex((category) => category.CategoryName === e[1]);
    if (indexOfSubcategory === -1) {
      outputCategories[indexOfMainCategory].SubCategories.push({
        CategoryName: e[1],
        SubCategories: []
      })
      indexOfSubcategory = outputCategories[indexOfMainCategory].SubCategories.length - 1;
    }
    if (e[2]) {
      let indexOfSubSubcategory = outputCategories[indexOfMainCategory].SubCategories[indexOfSubcategory].SubCategories.findIndex((category) => category.CategoryName === e[2]);
      if (indexOfSubSubcategory === -1) {
        outputCategories[indexOfMainCategory].SubCategories[indexOfSubcategory].SubCategories.push({
          CategoryName: e[2],
          SubCategories: [],
        })
        indexOfSubSubcategory = outputCategories[indexOfMainCategory].SubCategories[indexOfSubcategory].SubCategories.length - 1;
      }
      if (e[3]) {
        const indexOfSubSubSubcategory = outputCategories[indexOfMainCategory].SubCategories[indexOfSubcategory].SubCategories[indexOfSubSubcategory].SubCategories.findIndex((category) => category.CategoryName === e[3]);
        if (indexOfSubSubSubcategory === -1) outputCategories[indexOfMainCategory].SubCategories[indexOfSubcategory].SubCategories[indexOfSubSubcategory].SubCategories.push({
          CategoryName: e[3]
        })
      }
    }
  }
});

console.log(outputCategories)

Turn a one-dimensional array of arrays into a structure of nested objects

Answer №1

Answer №2

Similar questions

Scrolling to top using jQuery - Problem with incorrect anchor

Prevent regex from matching leading and trailing white spaces when validating email addresses with JavaScript

Prevent textArea from reducing empty spaces

In Rails 3, you can utilize JavaScript to submit a form_tag remotely, however ensure that it submits as

The ajax method is encountering an issue when trying to perform an action: It is unable to find the necessary anti-forgery form field "__RequestVerificationToken" required for the operation

Issue encountered when calling theme.breakpoints.down('') function from Material UI

"An error has occurred: React's this.setState function cannot

What is the best way to add a button to every row in Titanium Studio?

What is the best way to continuously compare two date variables every minute using Javascript?

Does Javascript support annotation? If not, what is the best way to easily switch between debug and productive modes in a declarative manner?

What is the best way to transfer the search query to a table filter when working with multiple JavaScript files?

Convert the jade file to an HTML file while keeping the original file name

What is the best way to access the authData while deleting a user from Firebase?

Invoking a parent controller method from a directive in AngularJS

Navigating URLs to Single Page Application Routing in Vue.js

Issue with ThreeJS AdditiveBlending, ShaderMaterial, and DepthTest

Insert a picture within the text input field

Encountering an issue while implementing a fresh design using Material-UI Version 5 and React Version 18.01 - Specifically facing problems with the '@mui/styles' package

Placing elements in Chrome compared to IE

The click function may need an additional click to complete its execution, but ideally, it should be accomplished in just one click