title: How to iterate through child objects from JSON API call
body: <p>I am beginner trying to iterate through the child objects from my API call to obtain the keys from the key-value pairs. So from my state example below, I'd like to be able print "id", "name" and "email" (and eventually use these to populate the 'headers' and 'accessors' in ReactTable to automatically generate my columns. This may be beyond the scope of my question for now). </p>
  
  <pre><code>state = {
  data: [
         {"id": 1, 
          "name": "John", 
          "email": "john@test.com"
         },
         {"id": 2, 
          "name": "Alex", 
          "email": "alex@test.com"
         },
         {"id": 3, 
          "name": "Sam", 
          "email": "sam@test.com"
         },
         {"id": 4, 
          "name": "Jess", 
          "email": "Jess@test.com"
         }
  ]
  }
  </code></pre>
  
  <p>The keys for all my objects are the same (id, name, email for example). However, I can only obtain the parent key of each of the child objects within the data. In my case, the parent keys just happen to be the index values of the objects within my array. So for the 4 objects as shown above, my console.log output will just be an array of ["0", "1", "2", "3"] since there are 4 objects. Instead, I would like to obtain ["id", "name", "email"]. My code is below. I'm willing to add another nested loop to access the child components, but whatever I do breaks the code. </p>
  
  <pre><code>getKeys = () =&gt; {
          var keysArr = []
          var i;
          for (i = 0; i &lt; 1; i++) { // i &lt; 1 because I only need to access the keys from a single object
              keysArr.push(Object.keys(this.props.data.children)); // The '.children' breaks my code but it is to show that I would like to access the child objects          
          }
          console.log(keysArr)
      }
  </code></pre>
  
  <p>Any help editing my code, or suggesting a new method would be greatly appreciated!</p>