Can't work out how to handle my lovely API data

JavaScript
1

I am stuck on the weather api call (pen https://codepen.io/m4sterbunny/pen/OZGQKy)

I can output the first-level data such as count (throwing that to html fine)- I have been fiddling to see what I can throw to console log with this:

console.log(data.list);

I can throw the entire data set, but drilling down is a problem.
List is as deep as I can go- in this Object . If I attempt to pull a property I fail. If I attempt to treat it like an array and pull based on position I fail (this is actually an object — right?).

Any hints how to drill down and grab data from the list section of this object?

2

I have tried data.name and data.list.name

4

Ah @camperextraordinaire if only it were that simple! My limited understanding thus far makes me expect that I could get the same result from :
console.log(myStorage.car.inside[“glove box”]); // returns “maps”
console.log(myStorage.car.inside[0]); // returns undefined

Thus breaking all my assumptions

var myStorage = {
  "car": {
    "inside": {
      "glove box": "maps",
      "passenger seat": "crumbs"
     },
    "outside": {
      "trunk": "jack"
    } } };

So imagine my surprise when I finally (in the manner of the 1000 monkeys recreating Shakespeare)
grab my location successfully by referring the index of a nested object/array thingie:

var data =
  {"message":"accurate","cod":"200","count":1,"list":[{
    "id":3362324,"name":"Roggebaai","coord":{
       "lat":-33.9167,"lon":18.4333},
     "main":{
       "temp":289.15,"pressure":1018,"humidity":93,"temp_min":289.15,"temp_max":289.15},
             "dt":1527143400,"wind":{
            "speed":3.6,"deg":360},
              "sys":{
                 "country":""},
                  "rain":null,"snow":null,"clouds":{
                              "all":75},
                      "weather":
     [      {"id":803,"main":"Clouds","description":"broken clouds","icon":"04d"}
     ]}]}           

console.log(data.list["id"]); // undefined
console.log(data.list.id); // undefined
console.log(data.list[0]); // returns array within list
console.log(data.list[0]["name"]); // returns location name

I will take it and use it, but I don’t understand it.

6

Ah- I was seeing “id” as lists first element. But you are pointing out that the first element is an array- which I can dip into using the property(?) id such as “id”, “name”

Do you have a tool you used to present the nested object/array as you did - OR did you diy? Also is there a method to describe the hierarchy of nests within the JSON object?

8

So you get a JSON object back from an API request and it could be anything- with any kind of structure.
(You have used beautifier to make it easier to read= awesome, will check it out)

Is there a simple way to summarise the structure of the object?

  "car": {
    "inside": {
      "glove box": "maps",
      "passenger seat": "crumbs"
     },
    "outside": {
      "trunk": "jack"
    } } };

This object has 2 inner arrays, with 2 items in first array, 1 item in second array
Something like 1>2 (2,1)

i.e. a tool to provide a summary of the object which describes its hierarchies

[excuse my poor use of terms, hard to learn a lexicon when you don’t speak it out loud]

or is it a case of building a function to do so that would (currently) melt my overheated brain?

10

ok- thanks

will attempt to:

  1. apply the proper terms and
  2. dissect the JSON

!

11

OK folks- don’t follow the path of crazy. Instead take a look at dev tools and you will get to see your Array all laid out, in a lovely hierarchical structure. Just what the dr ordered!

DevTools
DevTools1574×462 56 KB