Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Posted by jaredcowan
jaredcowan
11,808 Points

Help parsing JS object

I have a JS object:

var cart = {
    "Items": 3,
    "Item": {
          "Apple iPhone 5S": {
              "productId": 688,
         "url": "http://website.com/phone_iphone5s.html",
         "price": 299.99
           },
          "Solio Mono Solar Charger": {
          "productId": 655,
          "url": "http://website.com/solio_charger.html",
          "price": 29.95
           },
           "24 Month Warranty Package": {
             "productId": 681,
          "url": "http://website.com/24_month_warranty.html",
          "price": 129.95
           }
      },
    "Total": 459.89
}

I need to parse it and return:

Items: 3
 - Apple iPhone 5S ($299.99)
 - Solio Mono Solar Charger ($29.95)
 - 24 Month Warranty Package ($129.95)
Total: 459.89

I can't use the name of the object. i.e, 'Apple iPhone 5S'

I am completely stuck on how to do this.

Chyno Deluxe
Chyno Deluxe
16,936 Points

Are you trying to do this in plain JS or jQuery?

jaredcowan
jaredcowan
11,808 Points

Chyno Deluxe In plain JS

2 Answers

Steven Parker
Steven Parker
243,656 Points
Steven Parker
Steven Parker
243,656 Points

You didn't mention the course or provide a link to it, so I'm not sure if there's anything special about how this should be done.

But to just produce your result from this data, you could do something like this:

document.write("Items: " + cart.Items + "<br>");
for (var item in cart.Item) {
  document.write("- " + item + " ($"+ cart["Item"][item].price + ")<br>");
}
document.write("Total: " + cart.Total);
Dani Ivanov
Dani Ivanov
10,732 Points
Dani Ivanov
Dani Ivanov
10,732 Points

Here is one possible solution. I am not saying that this is the proper way nor the good way to do it BUT it works. However, you would have to modify your item object and include the item's name within the actual object (as a property).

var cart = {
    "Items": 3,
    "Item": {
         "Apple iPhone 5S": {
           "name": "Apple iPhone 5S",
           "productId": 688,
           "url": "http://website.com/phone_iphone5s.html",
           "price": 299.99
           },
          "Solio Mono Solar Charger": {
            "name": "Solio Mono Solar Charger",
            "productId": 655,
            "url": "http://website.com/solio_charger.html",
            "price": 29.95
           },
           "24 Month Warranty Package": {
            "name": "24 Month Warranty Package",
            "productId": 681,
            "url": "http://website.com/24_month_warranty.html",
            "price": 129.95
           }
      },
    "Total": "$459.89"
}

// Here is how you would access each item
/*
  console.log(cart.Item["Apple iPhone 5S"])
*/

// Here is how you can loop through them
/* -------------------------
for(prop in cart) {
  console.log(cart[prop]);
}
--------------------------- */

// Here is how you can loop and output them all
for(prop in cart) {
  if(typeof cart[prop] === 'object') {
    for(innerProp in cart[prop]) {
      console.log("- " + cart[prop][innerProp].name);
    }
  } else {
    console.log(prop + ": " + cart[prop]);
  }
}
Dani Ivanov
Dani Ivanov
10,732 Points

Actually Steven Parker's solutions is better :D