title: Conditionally define a const in react
body: <p>I have a search page, which queries an api to get an array of objects. It then renders a  for each element of the array. I'm trying to achieve this like so:</p>
  
  <pre><code>export default class SearchScreen extends Component {
    constructor(props) {
      super(props);
      this.state = {
        results: null
      };
    }
    componentDidMount() {
      const apiUrl =
        "foo";
      fetch(apiUrl)
        .then(response =&gt; response.json())
        .then(response =&gt;
          this.setState({
            results: response.results
          })
        );
    }
  
    render() {
        {this.state.results ? (
            const items = this.state.results.map((item, index) =&gt; {
                 return (
                      &lt;div&gt;
                          &lt;SearchResult name={item.name} /&gt;
                      &lt;/div&gt;
                      );
         })
          return &lt;div&gt;{items}&lt;/div&gt;;
         ) : (&lt;div&gt; LOADING...&lt;/div&gt;)}
  }
  </code></pre>
  
  <p>So, if this.state.results is not null, it should map its contents to a const, and then generate SearchResult elements.</p>
  
  <p>It is complaining that <code>const</code> is an unexpected keyword. Is there something wrong with conditionally defining constants?</p>