For Loop To Get One Variable From Each Nested Array

Question

I am trying to go through some Json and just get the "city_name" value from each nested array and print it in a list. QUESTION: How do you loop over an array and just get the first element from each array?

“state”: [
    {
      “city_name”: “Denver”,
      “timezone”: “MST”,
    },
    {
      “city_name”: “Austin”,
      “timezone”: “CST”,
    }
{
      “city_name”: “Atlanta”,
      “timezone”: “EST”,
    }
  ],

Javascript that I tried:

fetch(‘URL’).then(function(response) { 
        return response.json();
    }).then(function(data) {
        console.log(data);
        for (x in data.state) {
        document.getElementById("cities").innerHTML += data.state.city_name + "<br>";
    }    
    });

Response: undefined undefined undefined

Is this the correct way to get the value inside the array? Why does it say undefined? *this is just sample data to help explain my problem

const cityList = data.State.map(element => element.city_name); — Pavlo
– Pavlo, Commented Feb 19, 2018 at 16:14
Because you don't have a property named "state". It's "State" and it's an array so you should use for ... of instead of for ... in. — Derek 朕會功夫
– Derek 朕會功夫, Commented Feb 19, 2018 at 16:19
Pavlo: I tried the const cityList = data.State.map(element => element.city_name); But this just repeated Denver 3 times. I placed it inside the For Loop and outside. — glaemart
– glaemart, Commented Feb 19, 2018 at 16:32
Derek: The capital State was a typo in my sample, I've corrected it. I tried changing it to For "of" but that still resulted in "undefined" — glaemart
– glaemart, Commented Feb 19, 2018 at 16:35

yBrodsky · Accepted Answer · 2018-02-19 16:36:08Z

1

fetch(‘URL’).then(function(response) { 
  return response.json();
}).then(function(data) {
  let cities = data.state.map(e => e.city_name);
  document.getElementById("cities").innerHTML += cities.join('<br/>');
});

This should work assuming data is an object containing a property state

answered Feb 19, 2018 at 16:36

yBrodsky

5,0614 gold badges24 silver badges35 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

For Loop To Get One Variable From Each Nested Array

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related