I am trying to loop through the following:
{
"messages": [{
"msgFrom": "13223821242",
"msgBody": "Hi there"
}, {
"msgFrom": "Bill",
"msgBody": "Hello!"
}]
}
I want to retrieve msgFrom
and msgBody
I've tried:
for (var key in data) {
var obj = data[key];
for (var prop in obj) {
if(obj.hasOwnProperty(prop)){
console.log(prop + " = " + obj[prop]);
}
}
}
But the console log prints [Object]
Any ideas what im doing wrong?
This question is related to
javascript
In your script, data is your whole object.
key is "messages", which is an array you need to iterate through like this:
for (var key in data) {
var arr = data[key];
for( var i = 0; i < arr.length; i++ ) {
var obj = arr[ i ];
for (var prop in obj) {
if(obj.hasOwnProperty(prop)){
console.log(prop + " = " + obj[prop]);
}
}
}
}
Iterations
Method 1: forEach
method
messages.forEach(function(message) {
console.log(message);
}
Method 2: for..of
method
for(let message of messages){
console.log(message);
}
Note: This method might not work with objects, such as:
let obj = { a: 'foo', b: { c: 'bar', d: 'daz' }, e: 'qux' }
Method 2: for..in
method
for(let key in messages){
console.log(messages[key]);
}
To reference the contents of the single array containing one or more objects i.e. everything in the brackets of something like this {messages: [{"a":1,"b":2}] } ,just add [0] to the query to get the first array element
e.g. messages[0] will reference the object {"a":1,"b":2} as opposed to just messages which would reference the entire array [{"a":1,"b":2}]
from there you can work with the result as typical object and use Object.keys for example to get "a" and "b".
To loop through an object array or just array in javascript, you can do the following:
var cars = [{name: 'Audi'}, {name: 'BMW'}, {name: 'Ferrari'}, {name: 'Mercedes'}, {name: 'Maserati'}];
for(var i = 0; i < cars.length; i++) {
console.log(cars[i].name);
}
There is also the forEach() function, which is more "javascript-ish" and also less code but more complicated for its syntax:
cars.forEach(function (car) {
console.log(car.name);
});
And both of them are outputting the following:
// Audi
// BMW
// Ferrari
// Mercedes
// Maserati
The suggested for loop is quite fine but you have to check the properties with hasOwnProperty
. I'd rather suggest using Object.keys()
that only returns 'own properties' of the object (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/keys)
var data = {_x000D_
"messages": [{_x000D_
"msgFrom": "13223821242",_x000D_
"msgBody": "Hi there"_x000D_
}, {_x000D_
"msgFrom": "Bill",_x000D_
"msgBody": "Hello!"_x000D_
}]_x000D_
};_x000D_
_x000D_
data.messages.forEach(function(message, index) {_x000D_
console.log('message index '+ index);_x000D_
Object.keys(message).forEach(function(prop) { _x000D_
console.log(prop + " = " + message[prop]);_x000D_
});_x000D_
});
_x000D_
All the answers provided here uses normal function but these days most of our code uses arrow functions in ES6. I hope my answer will help readers on how to use arrow function when we do iteration over array of objects
let data = {
"messages": [{
"msgFrom": "13223821242",
"msgBody": "Hi there"
}, {
"msgFrom": "Bill",
"msgBody": "Hello!"
}]
}
Do .forEach on array using arrow function
data.messages.forEach((obj, i) => {
console.log("msgFrom", obj.msgFrom);
console.log("msgBody", obj.msgBody);
});
Do .map on array using arrow function
data.messages.map((obj, i) => {
console.log("msgFrom", obj.msgFrom);
console.log("msgBody", obj.msgBody);
});
Here is a generic way to loop through the field objects in an object (person):
for (var property in person) {
console.log(property,":",person[property]);
}
The person obj looks like this:
var person={
first_name:"johnny",
last_name: "johnson",
phone:"703-3424-1111"
};
for (let key in data) {
let value = data[key];
for (i = 0; i < value.length; i++) {
console.log(value[i].msgFrom);
console.log(value[i].msgBody);
}
}
You can use forEach method to iterate over array of objects.
data.messages.forEach(function(message){
console.log(message)
});
Refer: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach
Source: Stackoverflow.com