How to select a field from object of objects inside json in vanillajs?

Question

Just wanted to know, how would I be able to iterate through my json Object in the following format?

[
  {"page":1,"pages":1,"per_page":"600","total":264},
  [
    {
      "indicator":
     {"id":"NY.GDP.MKTP.CD","value":"GDP (current US$)"},
      "country":{"id":"1A","value":"ArabWorld"},
      "value":"2565871160292.11","decimal":"0","date":"2015"
    },
    {
      "indicator":
      {"id":"NY.GDP.MKTP.CD","value":"GDP (current US$)"},
      "country":{"id":"S3","value":"Caribbean small states"},
      "value":"66935278418.3676","decimal":"0","date":"2015"
    },
    {
      "indicator":
      {"id":"NY.GDP.MKTP.CD","value":"GDP (current US$)"},
      "country":{"id":"B8","value":"Central Europe and the Baltics"},
      "value":"1281495024762.4","decimal":"0","date":"2015"
    }
  ]
]

I have this method which returns the json object

countries: function() {
const URL = 'http://api.worldbank.org/countries/all/indicators/NY.GDP.MKTP.CD?date=2015:2015&per_page=600&format=json'
let countries = []
fetch(URL).then(i => i.json()).then(j => countries.push(...j))
console.log(countries);
}

So for instance, how would I be able to select the date field?

Thanks -B

Possible duplicate of [Access / process (nested) objects, arrays or JSON](http://stackoverflow.com/q/11922383/218196). But this might help more: [How do I return the response from an asynchronous call?](http://stackoverflow.com/q/14220321/218196). — Felix Kling, Jan 14 '17 at 20:12

FabioCosta · Accepted Answer · 2017-01-14T20:03:17.520

1

To select something deeply nested , like the date field you would access it like>

 countries[1][0].date

In which the second index [0] may be any index you have on the data array.

Check it here with your data

edited Jan 14 '17 at 20:03

answered Jan 14 '17 at 19:59

FabioCosta

3,069
6
28
50

That's exactly what I thought. But I get the following error `Uncaught TypeError: Cannot read property '0' of undefined` – WorldWideBangers Jan 14 '17 at 20:00
I added an example. And changed the data because indicator was not the right field. – FabioCosta Jan 14 '17 at 20:04
1

@WorldWideBangers: Your `console.log(countries)` is executed **before** the response was received, therefore I assume you are trying to access `countries` before the response was received. You should read [How do I return the response from an asynchronous call?](http://stackoverflow.com/q/14220321/218196) – Felix Kling Jan 14 '17 at 20:10
From what i understand, you wrapped around the objects with data variable. However When I call the api, the json object does not have a variabled wrapped around. I pretty much did what your doing, the only difference is that of the variable. I cannot change the format. – WorldWideBangers Jan 14 '17 at 20:11
@FelixKling Thank you so much. I can't believe I did not notice that. So essentially, my console was being triggered earlier than the response. – WorldWideBangers Jan 14 '17 at 20:13
Thanks Champs! Really appreciate your help – WorldWideBangers Jan 14 '17 at 20:14
1

@WorldWideBangers: Yep. You could add a `.then(() => console.log(countries))` or move the `console.log` in the same function you do `countries.push(...j)`. – Felix Kling Jan 14 '17 at 20:15

How to select a field from object of objects inside json in vanillajs?

1 Answers1