[javascript] How to iterate object in JavaScript?

I have this object. I want to iterate this object in JavaScript. How is this possible?

var dictionary = {
    "data": [
        {"id":"0","name":"ABC"},
        {"id":"1","name":"DEF"}
    ],
    "images": [
        {"id":"0","name":"PQR"},
        {"id":"1","name":"xyz"}
    ]
};

This question is related to javascript arrays

The answer is


Using a generator function you could iterate over deep key-values.

_x000D_
_x000D_
function * deepEntries(obj) { _x000D_
    for(let [key, value] of Object.entries(obj)) {_x000D_
        if (typeof value !== 'object') _x000D_
            yield [key, value]_x000D_
        else _x000D_
            for(let entries of deepEntries(value))_x000D_
                yield [key, ...entries]_x000D_
    }_x000D_
}_x000D_
_x000D_
const dictionary = {_x000D_
    "data": [_x000D_
        {"id":"0","name":"ABC"},_x000D_
        {"id":"1","name":"DEF"}_x000D_
    ],_x000D_
    "images": [_x000D_
        {"id":"0","name":"PQR"},_x000D_
        {"id":"1","name":"xyz"}_x000D_
    ]_x000D_
}_x000D_
_x000D_
for(let entries of deepEntries(dictionary)) {_x000D_
    const key = entries.slice(0, -1).join('.')_x000D_
    const value = entries[entries.length-1]_x000D_
    console.log(key, value)_x000D_
}
_x000D_
_x000D_
_x000D_


Here's all the options you have:

1. for...of (ES2015)

_x000D_
_x000D_
var dictionary = {_x000D_
    "data": [_x000D_
        {"id":"0","name":"ABC"},_x000D_
        {"id":"1","name":"DEF"}_x000D_
    ],_x000D_
    "images": [_x000D_
        {"id":"0","name":"PQR"},_x000D_
        {"id":"1","name":"xyz"}_x000D_
    ]_x000D_
};_x000D_
_x000D_
for (const entry of dictionary.data) {_x000D_
  console.log(JSON.stringify(entry))_x000D_
}
_x000D_
_x000D_
_x000D_

2. Array.prototype.forEach (ES5)

_x000D_
_x000D_
var dictionary = {_x000D_
    "data": [_x000D_
        {"id":"0","name":"ABC"},_x000D_
        {"id":"1","name":"DEF"}_x000D_
    ],_x000D_
    "images": [_x000D_
        {"id":"0","name":"PQR"},_x000D_
        {"id":"1","name":"xyz"}_x000D_
    ]_x000D_
};_x000D_
_x000D_
dictionary.data.forEach(function(entry) {_x000D_
  console.log(JSON.stringify(entry))_x000D_
})
_x000D_
_x000D_
_x000D_

3. for() (ES1)

_x000D_
_x000D_
var dictionary = {_x000D_
    "data": [_x000D_
        {"id":"0","name":"ABC"},_x000D_
        {"id":"1","name":"DEF"}_x000D_
    ],_x000D_
    "images": [_x000D_
        {"id":"0","name":"PQR"},_x000D_
        {"id":"1","name":"xyz"}_x000D_
    ]_x000D_
};_x000D_
_x000D_
for (let i = 0; i < dictionary.data.length; i++) {_x000D_
  console.log(JSON.stringify(dictionary.data[i]))_x000D_
}
_x000D_
_x000D_
_x000D_


var dictionary = {
        "data":[{"id":"0","name":"ABC"}, {"id":"1","name":"DEF"}],
        "images": [ {"id":"0","name":"PQR"},"id":"1","name":"xyz"}]
};


for (var key in dictionary) {
    var getKey = dictionary[key];
    getKey.forEach(function(item) {
        console.log(item.name + ' ' + item.id);
    });
}

Using for and foreach loop

var dictionary = {
     data: [{ id: "0", name: "ABC" }, { id: "1", name: "DEF" }],
     images: [{ id: "0", name: "PQR" }, { id: "1", name: "xyz" }]
};
dictionary.data.forEach(item => {
     console.log(item.id + " " + item.name);
});

for (var i = 0; i < dictionary.data.length; i++) {
     console.log(dictionary.data[i].id + " " + dictionary.data[i].name);
}

There's this way too (new to EcmaScript5):

dictionary.data.forEach(function(item){
    console.log(item.name + ' ' + item.id);
});

Same approach for images


for(index in dictionary) {
 for(var index in dictionary[]){
    // do something
  }
}

Use dot notation and/or bracket notation to access object properties and for loops to iterate arrays:

var d, i;

for (i = 0; i < dictionary.data.length; i++) {
  d = dictionary.data[i];
  alert(d.id + ' ' + d.name);
}

You can also iterate arrays using for..in loops; however, properties added to Array.prototype may show through, and you may not necessarily get array elements in their correct order, or even in any consistent order.


Something like that:

var dictionary = {"data":[{"id":"0","name":"ABC"},{"id":"1", "name":"DEF"}], "images": [{"id":"0","name":"PQR"},{"id":"1","name":"xyz"}]};

for (item in dictionary) {
  for (subItem in dictionary[item]) {
     console.log(dictionary[item][subItem].id);
     console.log(dictionary[item][subItem].name);
  }
}