Can somebody help me understand what is going wrong in this code?

[josephylee]

Hello,

I am working on a coding challenge where I take this object:

var currentInventory = [
  {
    name: 'Brunello Cucinelli',
    shoes: [
      {name: 'tasselled black low-top lace-up', price: 1000},
      {name: 'tasselled green low-top lace-up', price: 1100},
      {name: 'plain beige suede moccasin', price: 950},
      {name: 'plain olive suede moccasin', price: 1050}
    ]
  },
  {
    name: 'Gucci',
    shoes: [
      {name: 'red leather laced sneakers', price: 800},
      {name: 'black leather laced sneakers', price: 900}
    ]
  }
];

And form a series of strings, like this:

//...console output:
Brunello Cucinelli, tasselled black low-top lace-up, 1000
Brunello Cucinelli, tasselled green low-top lace-up, 1100
// and so on...

I was able to get pretty far with this current code:

function renderInventory(inventory) {
  //main function
}

//helper function to loop through individual 
//Brunello and Gucci objects
function extractString(obj) {
  let myArr = [];
  for (let prop in obj) {
    if (typeof obj[prop] === "number") { //if the property value
        obj[prop] += "\n";               //is a number or string,
      }                                  //then add it to myArr
                                         //to join(), later
    if (typeof obj[prop] == "string" || typeof obj[prop] == "number") {
      myArr.push(obj[prop]);
    }
    if (Array.isArray(obj[prop])) {     //if the prop is an array,
      for (let item of obj[prop]) {     //then loop through and 
        myArr.push(extractString(item)) //recursively call the 
      }                                 //function to unpack
    }                                   //its objects, further
  }
  return myArr
}

The resulting myArr looks like this when I console.log():

[ 'Brunello Cucinelli',
  [ 'tasselled black low-top lace-up', '1000\n' ],
  [ 'tasselled green low-top lace-up', '1100\n' ],
  [ 'plain beige suede moccasin', '950\n' ],
  [ 'plain olive suede moccasin', '1050\n' ] ]

Here’s the problem. I basically want to unshift() the Brunello Cucinelli string to each of the items in the array and then join() them, but it’s not working. When I console.log() the individual elements, myArr[0] comes up as Brunello Cucinelli, but myArr[1] comes up as 1000, and the rest come up as undefined. Furthermore, all of the subArrays typeof comes up as a string. I can’t loop through the subarrays, much less .join() them because JS is not recognizing that they exist.

Can someone please advise? Thank you.

[marcusparsons]

Are there very specific requirements for this coding challenge? Do you have to use recursion techniques or is that just something you thought of doing?

Because this can be immensely simplified. In the real world, I deal with JSON data like this all the time, and the beauty of a JSON data stream is that you can expect objects to have consistently named properties in every object.

[josephylee]

Thank you for replying.

I don’t need to use recursion. I was just trying to be slick. Hahah.

[marcusparsons]

Think about how you can use the item’s properties to your advantage, especially since they’re consistent. You could do this in one line of code, but it wouldn’t be very readable.

If you get stuck, I’ll send you a message with what I came up with that was 5 lines of code and readable. Think about looping through the main object and the shoes object and then using both of those sets of properties in a single string.

[josephylee]

I got it up to this point:

[ 'tasselled black low-top lace-up',
  1000,
  'tasselled green low-top lace-up',
  1100,
  'plain beige suede moccasin',
  950,
  'plain olive suede moccasin',
  1050 ]

Now I’m just trying to add the name Giovanni Cappalkasjdflkjd to each string, and add \n to each number.

  let name = myArr[0];
  let final = myArr.slice(1);
  for (let item of final) {
    if (typeof item === "string") {
      item = name + item;
    }
    if (typeof item === "number") {
      item = "\n" + item;
    }
  }

For some reason, for... of does identify that each items exist, but I can’t modify any of the items, for some reason. I wonder if for... of iteration is read-only. That can’t be.

[josephylee]

Okay. Lemme try. Thank you!

[marcusparsons]

Here is a scaffolded, plain language markup of a simple solution to this problem:

for every designer object of the main array {
   for every shoes object of this specific designer object {
      myArr.push(a single string containing the name of the designer and each shoe name and price);
   }
}

//at the very end of the function
return myArr.join('\n')

That is all you need to solve this. Just replace the plain language I used with JS syntax!

[josephylee]

Okay I really got it, now.

function renderInventory(inventory) {
  let myArr = [];
  for (let designer of inventory) {
    for (let specs of designer.shoes) {
      myArr.push(`${designer.name}, ${specs.name}, ${specs.price}`);
    }
  }
  return myArr.join("\n");
}

Man, thank you so much. Your solution is super elegant and streamlined. This was a great learning experience.

[marcusparsons]

Bellissimo, my friend! I love that you figured it out and you actually did literally exactly the same thing I had wrote down in a Snippet in my Dev Tools hahaha I mean like EXACTLY!

Happy Coding!!