title: Javascript: Iterating over JSON objects
body: <p>I have a JSON object that I want to iterate through.</p>
  
  <pre><code>"phone": {
      "Samsung": {
          "type": "S7"
      },
      "iPhone": {
          "type": "6S"
      },
      "Google": {
          "type": "Pixel"
      }
  }
  </code></pre>
  
  <p>I'm using <code>Object.key</code> to map through each of these values, which I THINK is the correct way to work with objects:</p>
  
  <pre><code>render() {
      //this.props.phone contains the objects "Samsung", "iPhone", and "Google"
      return (
          Object.keys(this.props.phones).map((type) =&gt; {
              console.log(type)
              return (
                  &lt;p&gt;Type of phone: {type}&lt;/p&gt;
              )
          })
      )
  } 
  </code></pre>
  
  <p>However, the <code>console.log</code> above returns this when I was expecting an object to return:</p>
  
  <p><a href="https://i.stack.imgur.com/INfOv.png" rel="noreferrer"><img src="https://i.stack.imgur.com/INfOv.png" alt="enter image description here"></a></p>
  
  <p>Why is it returning a value, and not an object?</p>