Looping through nesting of objects and arrays with Javascript and underscore

Question

I am trying to access objects that are nested within an array. I start with this JSON object (which was derived from an XML database output):

{"report":
        {"date":"15 Apr 2016",
         "metrics":
            {"metric":
               [
                {"name":"Bank Angle",
                 "display_parent_group":"Bankfull",
                 "display_child_group":"SiteShape",
                 "tolerance":"0.05",
                 "visits":
                  {"visit":
                   [
                    {"visit_id":"3047","value": "0.47"},
                    {"visit_id":"2164","value": "0.55"},
                    {"visit_id":"1568","value": "0.72"},
                    {"visit_id":"3431","value": "0.12"},
                    {"visit_id":"2428","value": "0.44"},
                    {"visit_id":"1567","value": "0.49"}
                   ]}},
                {"name":"Bank Angle SD",
                 "display_parent_group":"Bankfull",
                 "display_child_group":"SiteShape",
                 "tolerance":"0.05",
                 "visits":
                 {"visit":
                  [
                   {"visit_id":"3047","value": "0.12"},
                   {"visit_id":"2164","value": "0.05"},
                   {"visit_id":"1568","value": "0.21"},
                   {"visit_id":"3431","value": "0.68"},
                   {"visit_id":"2428","value": "0.22"},
                   {"visit_id":"1567","value": "0.13"}
                  ]}},
               {"name":"Bankfull Area",
                "display_parent_group":"Bankfull",
                "display_child_group":"SiteSize","tolerance":"0.05",
                "visits":
                 {"visit":
                  [
                   {"visit_id":"3047","value": "202"},
                   {"visit_id":"2164","value": "193"},
                   {"visit_id":"1568","value": "115"},
                   {"visit_id":"3431","value": "258"},
                   {"visit_id":"2428","value": "89"},
                   {"visit_id":"1567","value": "206"}
                  ]}}
               ]
             }
          }
}

I then use underscore to extract a subset of metric objects:

var table_metric = JSONData.report.metrics.metric;

var target_metrics = _.where(table_metric, {
                  display_parent_group : 'Bankfull', display_child_group: 'SiteShape'
                  });

This results in an array with two nested objects. Where I'm having a problem is then accessing the array of objects which is nested inside visits.visit. If, for instance, I want to build an array of values associated with the key visit_id, and I try:

function buildVisitIDArray(target_metrics) {
    var attrList = [];
    for(var i=0; i<target_metrics.length; i++) {
      var visit_records = target_metrics[i].visits[1];
      console.log(visit_records);
      for(visit_record in visit_records) {
        attrList.push(_.pluck(visit_record, "visit_id"));
    } 
}
return attrList

}

I just get an array of undefined results. I've spent hours trying variations on the syntax to get at the nested "visit" objects, but I just can't seem to figure it out.

Any help is much appreciated for this novice!

André Gumieri · Accepted Answer · 2016-04-20 18:25:30Z

1

In your buildVisitIDArray function, you are trying to get target_metrics[i].visits[1] as if it was an array, but it's actually an object, so you should use it this way:

function buildVisitIDArray(target_metrics) {
    attrList = [];
    for(var i=0; i<target_metrics.length; i++) {
        var visit_records = target_metrics[i].visits; // Removed the array call ([1])
        console.log(visit_records);
        for(visit_record in visit_records) {
            attrList.push(_.pluck(visit_records[visit_record], "visit_id"));
        }
    }
    return attrList;
}

Hope it helps :)

edited Apr 20, 2016 at 18:25

answered Apr 20, 2016 at 17:44

André Gumieri

2752 silver badges7 bronze badges

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

3 Comments

jesselangdon Over a year ago

Thanks André. Now I get an array with the correct length (5), but all of the items are 'undefined'. I'm still not doing something right.

André Gumieri Over a year ago

@tinyplanet00 my mistake. I didn't saw the return of the function. Fixed it. In your for(visit_record in visit_records), the visit_record is a key, not a value. So, you must access using visit_records[visit_record]. Now it's returning a bunch of IDs :) (the code is edited in my solution)

André Gumieri Over a year ago

You're welcome! Would you mind to upvote my solution, please, @tinyplanet00?

carl · Accepted Answer · 2016-04-20 18:12:51Z

0

You may also have an issue if you're not defining attrList with the var keyword somewhere else in your code.

Building on Andre's answer, you may want to change this line to be:

visit_records = target_metrics[i].visits.visit;

to go one layer deeper, then do a regular array for loop afterward.

edited Apr 20, 2016 at 18:12

answered Apr 20, 2016 at 17:59

carl

4194 silver badges12 bronze badges

1 Comment

jesselangdon Over a year ago

Oops. Yes you're right. Edited my question. Thanks!

Collectives™ on Stack Overflow

Looping through nesting of objects and arrays with Javascript and underscore

2 Answers 2

3 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related