get JSON key value pair within json object array in javascript

Question

Here is my JSON

[  
   {  
      "var5":"item-company-1",
      "asd2":"item-company-1",
      "tie1":"0",
      "cxs1":"481.891px",
      "xcve2":"130.563px"
   },
   {  
      "var5":"item-company-2",
      "asd2":"item-company-2",
      "tie1":"0",
      "cxs1":"481.891px",
      "xcve2":"130.563px"
   },
   {  
      "var5":"item-company-3",
      "asd2":"item-company-3",
      "tie1":"0",
      "cxs1":"481.891px",
      "xcve2":"130.563px"
   }
]

How do I read the key and the value? Keep in mind I might not know the Key. I tried using...

var data = JSON.parse(json);

Object.keys(data).forEach(function(prop) {
  // `prop` is the property name
  // `data[prop]` is the property value
     console.log(prop + " = " + data[prop]);
});

However it just outputs

0 = [object Object]
1 = [object Object]
2 = [object Object]

EDIT FOR CLARIFICATION

in PHP I get the following output which is what I'm trying to achieve from javascript

0:
var5 => item-company-1
asd2 => item-company-1
tie1 => 0
cxs1 => 481.891px
xcve2 => 130.563px
1:
var5 => item-company-2
asd2 => item-company-2
tie1 => 0
cxs1 => 481.891px
xcve2 => 130.563px
2:
var5 => item-company-3
asd2 => item-company-3
tie1 => 0
cxs1 => 481.891px
xcve2 => 130.563px

Answer 1

This should work...

data.forEach(function(obj) {
  for (let key in obj) {
    let value = obj[key];
    console.log(`Key: ${key}, Value: ${value}`)
  }
});

In your implementation, Object.keys(data) is evaluating to an array of the numeric keys in the data array. So the prop parameter in your callback function is not referring to the keys of the objects in the data array.

Object.keys()

Answer 2

You can try this:

 var data = [ { "var5":"item-company-1", "asd2":"item-company-1", "tie1":"0", "cxs1":"481.891px", "xcve2":"130.563px" }, { "var5":"item-company-2", "asd2":"item-company-2", "tie1":"0", "cxs1":"481.891px", "xcve2":"130.563px" }, { "var5":"item-company-3", "asd2":"item-company-3", "tie1":"0", "cxs1":"481.891px", "xcve2":"130.563px" } ] for(var i=0,item;item=data[i++];){ console.log("==========="+i+"=========") for(var key in item){ console.log(key+":"+item[key]) } }

Answer 3

JSON.parse has a reviver function that lets you view key/value pairs at it parses:

 var data = '[{"var5":"item-company-1","asd2":"item-company-1","tie1":"0","cxs1":"481.891px","xcve2":"130.563px"},{"var5":"item-company-2","asd2":"item-company-2","tie1":"0","cxs1":"481.891px","xcve2":"130.563px"},{"var5":"item-company-3","asd2":"item-company-3","tie1":"0","cxs1":"481.891px","xcve2":"130.563px"}]'; JSON.parse(data, function(key, value) { console.log(key, "=>", value); return value; });

To iterate just the keys from the objects, use nested loops:

 var json = '[{"var5":"item-company-1","asd2":"item-company-1","tie1":"0","cxs1":"481.891px","xcve2":"130.563px"},{"var5":"item-company-2","asd2":"item-company-2","tie1":"0","cxs1":"481.891px","xcve2":"130.563px"},{"var5":"item-company-3","asd2":"item-company-3","tie1":"0","cxs1":"481.891px","xcve2":"130.563px"}]'; var data = JSON.parse(json); for (var i = 0; i < data.length; i++) { console.log(i + ":"); for (var key in data[i]) { console.log(key, "=>", data[i][key]); } }

Answer 4

You actually have array for objects. So Code should look like this

var data = JSON.parse(json);
for (var key in data) {
    for (var prop in data[key]) {
        console.log(prop + " = " + data[key][prop]);
    }
}

Answer 5

Try this on your code

 var data = [ { "var5":"item-company-1", "asd2":"item-company-1", "tie1":"0", "cxs1":"481.891px", "xcve2":"130.563px" }, { "var5":"item-company-2", "asd2":"item-company-2", "tie1":"0", "cxs1":"481.891px", "xcve2":"130.563px" }, { "var5":"item-company-3", "asd2":"item-company-3", "tie1":"0", "cxs1":"481.891px", "xcve2":"130.563px" } ]; data.forEach(function(obj,k) { console.log(k+":"); // `prop` is the property name // `data[prop]` is the property value Object.keys(obj).forEach(function(key){ console.log(k+":" +key + " = " + obj[key]); }); });