Parsing an array of nested objects in Javascript using recursion

Question

I want to print all the brand names with their parent name by traversing through this array. For top level brands , parent as "None".
e.g. None : Parle, Parle : Parle Agro, Parle Agro : Frooti

let inventory = [
  {
    brand: 'Parle',
    products: [
      {
        brand: 'Parle Agro',
        products: [
          {
            brand: 'Frooti',
            products: []
          },
          {
            brand: 'Bailey',
            products: []
          }
        ]
      }
    ]
  },
  {
    brand: 'Pepsico',
    products: [
      {
        brand: 'VB',
        products: [
          {
            brand: 'Lays',
            products: []
          },
          {
            brand: 'Kurkure',
            products: [
              {
                brand: 'Mad Angles',
                products: []
              }
            ]
          }
        ]
      },
      {
        brand: 'Pepsi',
        products: []
      }
    ]
  },
  {
    brand: 'Cadbury',
    products: []
  } 
];

I have tried following approach but I'm missing out somewhere.

function brandName(obj){
for (var key in obj) {
    var item = obj[key];
    if (typeof item === "object"){
        brandName(item.products); }
} } brandName(inventory);

IT goldman · Accepted Answer · 2022-08-25 20:57:41Z

1

Basically I've used a recursion that gets an inventory and a parent (default None) and prints the parent along with all the children. Then doing recursion for each of the children, having the child itself as parent. It's easier to see the code.

var inventory = [{brand:"Parle",products:[{brand:"Parle Agro",products:[{brand:"Frooti",products:[]},{brand:"Bailey",products:[]}]}]},{brand:"Pepsico",products:[{brand:"VB",products:[{brand:"Lays",products:[]},{brand:"Kurkure",products:[{brand:"Mad Angles",products:[]}]}]},{brand:"Pepsi",products:[]}]},{brand:"Cadbury",products:[]}]

function brandName(inventory, parent) {
  parent = parent || "None"
  inventory.forEach(function(item) {
    console.log(parent + " : " + item.brand)
    brandName(item.products, item.brand)
  })
}

brandName(inventory);

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

edited Aug 25, 2022 at 20:57

answered Aug 25, 2022 at 20:00

IT goldman

20.4k2 gold badges18 silver badges34 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

pilchard Over a year ago

I see you keep using var in your answers which isn't recommended now that there are more specifically scoped let and const (in this case even changing the OP's let to a var). Also you are redeclaring the parameter here instead of simply assigning it a default value in the function declaration plus you're using an OR short circuit which is better replaced with nullish coallescing.

IT goldman Over a year ago

var - being a more general form of let, const or any future keyword - is enough for me. Function fixed. Short circuiting is fun.

Mulan · Accepted Answer · 2022-08-26 02:34:40Z

Here's a recursive generator that allows the caller to decide the effect. menu does a simple type analysis on the input t and responds accordingly -

function *menu(t, parent = "None") {
  switch (t?.constructor) {
    case Array:
      for (const child of t)
        yield *menu(child, parent)
      break
    case Object:
      yield [parent, t.brand]
      yield *menu(t.products, t.brand)
      break
  }
}

const inventory =
  [{brand:"Parle",products:[{brand:"Parle Agro",products:[{brand:"Frooti",products:[]},{brand:"Bailey",products:[]}]}]},{brand:"Pepsico",products:[{brand:"VB",products:[{brand:"Lays",products:[]},{brand:"Kurkure",products:[{brand:"Mad Angles",products:[]}]}]},{brand:"Pepsi",products:[]}]},{brand:"Cadbury",products:[]}]

for (const item of menu(inventory))
  console.log(item.join(":"))

.as-console-wrapper { min-height: 100%; top: 0; }

None:Parle
Parle:Parle Agro
Parle Agro:Frooti
Parle Agro:Bailey
None:Pepsico
Pepsico:VB
VB:Lays
VB:Kurkure
Kurkure:Mad Angles
Pepsico:Pepsi
None:Cadbury

If you want to collect all of the items in an array, use Array.from -

Array.from(menu(inventory))
// => [ ["None", "Parle"], ["Parle", "Parle Agro"], ...]

Array.from(menu(inventory), p => p.join(":"))
// [ "None:Pare", "Parle:Parle Agro", ...]

Scott Sauyet · Accepted Answer · 2022-08-26 15:41:09Z

A simple recursion will extract all the brand/parent pairs into an array of objects:

const collectBrands = (xs, parent = "None") =>
  xs .flatMap (({brand, products = []}) => [
    {brand, parent},
    ... collectBrands (products, brand)
  ])

const inventory = [{brand: "Parle", products: [{brand: "Parle Agro", products: [{brand: "Frooti", products: []}, {brand: "Bailey", products: []}]}]}, {brand: "Pepsico", products: [{brand: "VB", products: [{brand: "Lays", products: []}, {brand: "Kurkure", products: [{brand: "Mad Angles", products: []}]}]}, {brand: "Pepsi", products: []}]}, {brand: "Cadbury", products: []}]

console .log (collectBrands (inventory))

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

We simply map over the input, extracting the current brand and parent into an object (defaulting parent to 'None'), recurring on the list of products, and combining them into a single list. By using flatMap we combined these into a single list of results.

That will yield something like this:

[
  {brand: "Parle", parent: "None"},
  {brand: "Parle Agro", parent: "Parle"}, 
  {brand: "Frooti", parent: "Parle Agro"}, 
  {brand: "Bailey", parent: "Parle Agro"},
  {brand: "Pepsico", parent: "None"},
  {brand: "VB", parent: "Pepsico"},
  {brand: "Lays", parent: "VB"},
  {brand: "Kurkure", parent: "VB"},
  {brand: "Mad Angles", parent: "Kurkure"},
  {brand: "Pepsi", parent: "Pepsico"},
  {brand: "Cadbury", parent: "None"}
]

And if you want them all in your String format, you can create this array and then format it with something like this: :

console .log (
  collectBrands (inventory) .map (({parent, brand}) => `${parent}: ${brand}`) .join (', ')
) 
//=> "None: Parle, Parle: Parle Agro, Parle Agro: Frooti, Parle Agro: Bailey, None: Pepsico, Pepsico: VB, VB: Lays, VB: Kurkure, Kurkure: Mad Angles, Pepsico: Pepsi, None: Cadbury"

Collectives™ on Stack Overflow

Parsing an array of nested objects in Javascript using recursion

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related