javascript：遍历嵌套对象/数组并添加属性

Question

I am not very strong with Javascript. I have a nested array which is a JSON representation of the backend data. It shows a list of proofs and the images used in each proof. Its looks like below:

var project = [{
    "proof":"Proof_1",
    "images":[
        {
            "image_id":"12469",
            "name":"1911791794.jpg",
        },
        {
            "image_id":"12470",
            "name":"1911802897.jpg"
        },
        {
            "image_id":"12471",
            "name":"1911761073.jpg"
        }
},
{
    "proof":"Proof_2",
    "images":[
        {
            "image_id":"12469",
            "name":"1911791794.jpg",
        },
        {
            "image_id":"12470",
            "name":"1911802897.jpg"
        }
}];

I want to add the image_count to each proof section,so that modified data structure looks like this:

var project = [{
    "proof":"Proof_1",
    "image_count": 3, //<----this is new property I want to add
    "images":[
        {
            "image_id":"12469",
            ...

I checked some answers but because of my lack of understanding javascript iteration properly I am unable to get this done.

When I do: for (var proof in project) { console.log(proof); }

I just get 0,1,2 ...etc printed. I am not getting this, so I help someone in SO will help me understand how to add this property I want.

Thanks in advance.

Answer 1

You can take advantage of Array.prototype.map method:

project = project.map(function (item) {
    item.image_count = item.images.length;
    return item;
});

Working demo.

Also, as @Sebastian Lasse pointed out - you should name your array using plural form to avoid confusion ( projects instead of project ).

Answer 2

You can use .map or simple loop

 var projects = [{ "proof": "Proof_1", "images": [{ "image_id": "12469", "name": "1911791794.jpg", }, { "image_id": "12470", "name": "1911802897.jpg" }, { "image_id": "12471", "name": "1911761073.jpg" }] }, { "proof": "Proof_2", "images": [{ "image_id": "12469", "name": "1911791794.jpg", }, { "image_id": "12470", "name": "1911802897.jpg" }] }]; projects = projects.map(function (element) { element.image_count = element.images.length; return element; }); console.log(projects); var len = projects.length, i; for (i = 0; i < len; i++) { projects[i].image_count = projects[i].images.length; } console.log(projects); 

Answer 3

You could - after correcting the missing ] error in your JSON - do this :

project.forEach(function(proof) {
    proof.image_count = proof.images.length;
})

demo -> http://jsfiddle.net/dLd8wvpb/