How to iterate object in JavaScript?
JavascriptArraysJavascript Problem Overview
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"}
]
};
Javascript Solutions
Solution 1 - Javascript
You can do it with the below code. You first get the data array using dictionary.data and assign it to the data variable. After that you can iterate it using a normal for loop. Each row will be a row object in the array.
var data = dictionary.data;
for (var i in data)
{
var id = data[i].id;
var name = data[i].name;
}
You can follow similar approach to iterate the image array.
Solution 2 - Javascript
There's this way too (new to EcmaScript5):
dictionary.data.forEach(function(item){
console.log(item.name + ' ' + item.id);
});
Same approach for images
Solution 3 - Javascript
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);
}
}
Solution 4 - Javascript
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.
Solution 5 - Javascript
Using a generator function you could iterate over deep key-values.
function * deepEntries(obj) {
for(let [key, value] of Object.entries(obj)) {
if (typeof value !== 'object')
yield [key, value]
else
for(let entries of deepEntries(value))
yield [key, ...entries]
}
}
const dictionary = {
"data": [
{"id":"0","name":"ABC"},
{"id":"1","name":"DEF"}
],
"images": [
{"id":"0","name":"PQR"},
{"id":"1","name":"xyz"}
]
}
for(let entries of deepEntries(dictionary)) {
const key = entries.slice(0, -1).join('.')
const value = entries[entries.length-1]
console.log(key, value)
}
Solution 6 - Javascript
for(index in dictionary) {
for(var index in dictionary[]){
// do something
}
}
Solution 7 - Javascript
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);
});
}
Solution 8 - Javascript
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);
}
Solution 9 - Javascript
Here's all the options you have:
1. for...of (ES2015)
var dictionary = {
"data": [
{"id":"0","name":"ABC"},
{"id":"1","name":"DEF"}
],
"images": [
{"id":"0","name":"PQR"},
{"id":"1","name":"xyz"}
]
};
for (const entry of dictionary.data) {
console.log(JSON.stringify(entry))
}
2. Array.prototype.forEach (ES5)
var dictionary = {
"data": [
{"id":"0","name":"ABC"},
{"id":"1","name":"DEF"}
],
"images": [
{"id":"0","name":"PQR"},
{"id":"1","name":"xyz"}
]
};
dictionary.data.forEach(function(entry) {
console.log(JSON.stringify(entry))
})
3. for() (ES1)
var dictionary = {
"data": [
{"id":"0","name":"ABC"},
{"id":"1","name":"DEF"}
],
"images": [
{"id":"0","name":"PQR"},
{"id":"1","name":"xyz"}
]
};
for (let i = 0; i < dictionary.data.length; i++) {
console.log(JSON.stringify(dictionary.data[i]))
}