title: reactjs nullcheck before mapping through array of markers
body: <p>Hello i'm trying to map through an array of markers, but the first object ist empty. How can i make a Nullcheck in JSX so that only the the Markers appear on the Map that are not empty.
  the function is in the <code>const GettingStartedGoogleMap</code>. </p>
  
  <pre><code>const GettingStartedGoogleMap = withGoogleMap(props =&gt;(
      &lt;GoogleMap
        defaultZoom={13}
        center={props.center}
        &gt;
        {if(props.markers !== undefined &amp;&amp; props.markers != null &amp;&amp; props.markers.length &gt; 0)
          {props.markers.map(marker =&gt; (
            &lt;InfoWindow  position={{ lat: marker.latitude, lng: marker.longitude }}
            key={marker.id}&gt;
                &lt;div&gt;
                {marker.price}
                &lt;/div&gt;
            &lt;/InfoWindow&gt;
          ))}
        }
  &lt;/GoogleMap&gt;
  ));
  
  export class AppMap extends Component {
  
   constructor(props) {
     super(props);
     this.Ref = firebase.database().ref().child('app').child('cards');
     this.state = ({
       markers : [{
         latitude: "",
         longitude: "",
         price: "",
         id: ""
       }]
     })
   }
  
   componentWillUpdate (){
     const previousMarker = this.state.markers;
     this.Ref.orderByChild('address').equalTo(this.props.city)
        .on('child_added', snap =&gt; {
        previousMarker.push({
          latitude: snap.node_.children_.root_.right.left.value.children_.root_.left.value.value_,
          longitude: snap.node_.children_.root_.right.left.value.children_.root_.value.value_,
          price: snap.node_.children_.root_.value.value_,
          key: snap.key + "_Marker",
  
          })
  
          console.log(previousMarker)
  
        })
   }
  
  
       render() {
           return (
               &lt;div style={{height: `400px`}}&gt;
                   &lt;GettingStartedGoogleMap
                   containerElement={
                  &lt;div style={{ height: `100%` }} /&gt;
                }
                mapElement={
                  &lt;div style={{ height: `100%` }} /&gt;
                }
  
                center={this.props.center}
                markers={this.state.markers}
  
                googleMapURL="https://maps.googleapis.com/maps/api/js?v=3.exp&amp;libraries=geometry,drawing,places"
                /&gt;
              &lt;/div&gt;
           );
       }
     }
  </code></pre>