title: Why is object coming up as undefined?
body: <p>I am trying to get some location coordinates in this function</p>
  
  <pre><code>getLocation(){
      $.ajax({
          url:"//freegeoip.net/json/?callback=?",
          dataType:'json',
          success:function (data) {
              this.setState({
                  coordinates:data
              },function () {
                  console.log(this.state);
              })
          }.bind(this),
          error:function (xhr,status,err) {
              console.log(err);
          }
      })
  }
  </code></pre>
  
  <p>I call it in the componentWillMount() stage and try to populate this structure.</p>
  
  <pre><code>this.state = {
      restaurantsByLocations:{},
      coordinates:{}
  }
  </code></pre>
  
  <p>However, when I try to pass it to </p>
  
  <pre><code>getRestaurantsByLocation(lat,longi){
  /**Some code here **/
  
  }
  </code></pre>
  
  <p>It doesn't get passed. On Doing console.log(), my object is populated. However on doing  console.log(JSON.stringify(this.state.coordinates)), it shows that the object is indeed empty.</p>
  
  <p>This is my componentWillMount()</p>
  
  <pre><code>componentWillMount(){
  
  this.getLocation();
  this.getRestaurantsByLocation(this.state.coordinates.latitude,this.state.coordinates.longitude)
  
  
  }
  </code></pre>