title: forEach over es6 Map in JSX
body: <p>I had a javascript array that was rendering components using <code>array.map</code>. I switched this array to an es6 <code>Map</code> in order to be able to use key-value pairs to find items more easily, and switched from a <code>.map</code> to a <code>forEach</code> over the Map. Inside the <code>forEach</code> I call a render method that returns a React component, but it isn't being rendered. How do I render a component inside the <code>forEach</code>?</p>
  <pre><code>&lt;div className='gallery__items'&gt;
      {resultsByGuid.forEach((result, index) =&gt; {
          key++;
          this.renderGalleryItem(result, key);
      })} 
  &lt;/div&gt;
  </code></pre>
  <p>Here is the renderGalleryItem method:</p>
  <pre><code>renderGalleryItem = (item, index) =&gt; {
      const { gridItemSelected, itemThumbnailRequested } = this.props;
      return (
          &lt;GalleryItem
              key={index}
              item={item}
              onClick={gridItemSelected}
              fetchThumbnailFunc={itemThumbnailRequested}
          /&gt;
      );
  };
  </code></pre>
  <p>I understand that forEach doesn't return anything but does that mean I can't render inside it?</p>