title: How do I map over an object?
body: <pre><code>constructor(props){
    super(props);
  
    this.state = {
        posts: [],
    }
  }
  
  componentWillMount() {
    fetch("https://newsapi.org/v2/top-headlines?country=us&amp;apiKey=${API_KEY}")
        .then(res =&gt; res.json())
        .then(data =&gt; this.setState({posts:data}));
  }
  
  render() {
    return (
      &lt;div&gt;
        &lt;ul&gt;
          { this.state.posts.map(post =&gt; &lt;li key={post.id}&gt;{post.title}&lt;/li&gt;) }
        &lt;/ul&gt;
      &lt;/div&gt;
    )
  }
  </code></pre>
  
  <p>I'm trying to map the title of this news object but whenever i try to do that I get this error: TypeError: this.state.posts.map is not a function.
  This is the picture of the object from data : <a href="https://i.imgur.com/ctvXXWA.png" rel="nofollow noreferrer">https://i.imgur.com/ctvXXWA.png</a></p>