javascript - Iterate object and array with for loop and add keyvalue pair - Stack Overflow

I'm trying to understand how to iterate over an object that resembles the following:

var json = {"tsn": {
    "events": [
        {
          "title": "Lorem ipsum",  
          "description": "Dolor sit"
        },
        {
          "title": "Duis aute irure",  
          "description": "eu fugiat nulla pariatur"
        },
      ],
    "occurrence": [
        "Music",
        "Party"
      ]
    }    
};

I would like to explicitly use a for loop as per the code below (and not for in)

for(var i = 0; i < json.length; i++) {
    console.log(json.tsn.events[i].title);
}

Why does the above code does not get all of title?

Secondly, how should I get all the occurrence?

And lastly, how I can add to events a new key/value pair such as {"image": "cat.jpg"} so that the json object results like this:

var json = {"tsn": {
    "events": [
        {
          "title": "Lorem ipsum",  
          "description": "Dolor sit",
          "image": "cat.jpg"
        },
        {
          "title": "Duis aute irure",  
          "description": "eu fugiat nulla pariatur",
          "image": "dog.jpg"
        },
      ],
    "occurrence": [
        "Music",
        "Party"
      ]
    }    
};

I'm trying to understand how to iterate over an object that resembles the following:

var json = {"tsn": {
    "events": [
        {
          "title": "Lorem ipsum",  
          "description": "Dolor sit"
        },
        {
          "title": "Duis aute irure",  
          "description": "eu fugiat nulla pariatur"
        },
      ],
    "occurrence": [
        "Music",
        "Party"
      ]
    }    
};

I would like to explicitly use a for loop as per the code below (and not for in)

for(var i = 0; i < json.length; i++) {
    console.log(json.tsn.events[i].title);
}

Why does the above code does not get all of title?

Secondly, how should I get all the occurrence?

And lastly, how I can add to events a new key/value pair such as {"image": "cat.jpg"} so that the json object results like this:

var json = {"tsn": {
    "events": [
        {
          "title": "Lorem ipsum",  
          "description": "Dolor sit",
          "image": "cat.jpg"
        },
        {
          "title": "Duis aute irure",  
          "description": "eu fugiat nulla pariatur",
          "image": "dog.jpg"
        },
      ],
    "occurrence": [
        "Music",
        "Party"
      ]
    }    
};

• javascript

Share Improve this question Follow edited Feb 27, 2017 at 22:41 Heretic Monkey 12.1k77 gold badges6161 silver badges131131 bronze badges asked Feb 27, 2017 at 22:30 NiceroNicero 4,38777 gold badges3232 silver badges5757 bronze badges 2

• A regular for loop is for arrays - you have an object, one of the keys in your object contains an array, so iterate over that key. for (var i = 0; i < json.tsn.events.length; i++) – tymeJV Commented Feb 27, 2017 at 22:33
• JSON is a string format. You have an object. I've removed references to JSON in your question, except for the name of your variable. – Heretic Monkey Commented Feb 27, 2017 at 22:43

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 2

Because you're using the wrong length. Use:

for (var i=0;i<json.tsn.events.length; i++) { ...

And then you should be golden. For the occurrence, it's much the same -- loop as:

for (var i=0;i<json.tsn.occurrence.length; i++) {
    console.log(json.tsn.occurrence[i]);
}

And you'll pull those values back also.

Personally I rather use a forEach for this kind of actions. I would do this:

var json = {"tsn": {
"events": [
    {
      "title": "Lorem ipsum",  
      "description": "Dolor sit"
    },
    {
      "title": "Duis aute irure",  
      "description": "eu fugiat nulla pariatur"
    },
  ],
"occurrence": [
    "Music",
    "Party"
  ]
}    
};

var events = json.tsn.events;

// loop to iterate through array of tsn events
events.forEach(function(item){
    console.log(item.title); // to print each of the titles
    item["image"] = "yourImage.jpg"; // will add to each item the image
    // ... do any other item specific operation
});

To iterate through occurrence I would do the same thing in a different forEach because they both have different lengths.

json.tsn.events is an array.

json.tsn.events has a length.

json.tsn.events[i] is trying to use the iterator to loop over the array.

json.length is trying to pute the iterator using the top level object instead of the array.

You need to use the length of the array. json.tsn.events.length.

if you can use the of keyword you can do this, which is basically the same as running a for loop but less verbose but unable to access indices.

var json = {"tsn": {
    "events": [
        {
          "title": "Lorem ipsum",  
          "description": "Dolor sit"
        },
        {
          "title": "Duis aute irure",  
          "description": "eu fugiat nulla pariatur"
        },
      ],
    "occurrence": [
        "Music",
        "Party"
      ]
    }    
};

for (let event of json.tsn.events)
{
	console.log(event.title);
}

for (let occur of json.tsn.occurrence)
{
	console.log(occur);
}