Underscore.js Find and return element in nested array

Question

I have data-structure like this:

[
    {
        "name": "AAAA",
        "children": [
            {"name": "vvv", "id": 3},
            {"name": "vvv22", "id": 4}
        ]
    },
    {
        "name": "BBBB",
        "children": [
            {"name": "ggg", "id": 5},
            {"name": "ggggv22", "id": 6}
        ]
    },
]

And I want to find and return child with given ID. How to achieve this using Underscore.js?

My current realisation without using Underscore:

for (var i = 0; i < data.length; i++) {
     var dataItem= data[i];
     for (var j = 0; j < dataItem.children.length; j++) {
        var child = dataItem.children[j];
        if (child .id == id) {
             return child;  
        }
     }
} 

Answer 1

1. Pluck the children keys from your top level objects
2. Flatten the resulting array
3. Find the first object matching the condition, e.g having the correct id
4. Chain these operations

which leads to

var res = _(data).chain().
    pluck('children').
    flatten().
    findWhere({id: 3}).
    value();

And a demo

var data = [
    {
        "name": "AAAA",
        "children": [
            {"name": "vvv", "id": 3},
            {"name": "vvv22", "id": 4}
        ]
    },
    {
        "name": "BBBB",
        "children": [
            {"name": "ggg", "id": 5},
            {"name": "ggggv22", "id": 6}
        ]
    }
];
var res = _(data).chain().
    pluck('children').
    flatten().
    findWhere({id: 3}).
    value();
    
console.log(res);

<script src="http://underscorejs.org/underscore-min.js"></script>

Answer 2

I got this function using underscore which will do your work.

var getChild = function(id,data){
    var allChildren = _.flatten(_.pluck(data,'children'));
    var childWithId = _.find(allChildren,function(child){return child.id == id});
    return childWithId;
}

var child = getChild(5,data);
console.log(child);