title: How to store the object in array right after fetching it from API in Javascript?
body: <p>While converting the locations, I want to create an object as lats and longs such as <code>{&quot;lat&quot;:123123, &quot;lng&quot; : 12324}</code> of the actual location and immediately store it into <code>coordinates</code> array. However, at the end, when I check the <code>coordinates</code> array, it is shown as an empty array. Is it because the <code>coordinates.push({&quot;lat&quot; : lat, &quot;lng&quot;: lng})</code> command does not execute right after getting a response from the web?</p>
  <p>I am getting all the lats and logs of appropriate locations. But can't store it into an array.</p>
  <p>I removed the key for the purpose of security.
  How can I store the object into an array?</p>
  <pre><code> var coordinates = [];
      for(var i = 0; i &lt; locations.length; i++) {
          console.log(locations[i]);
          geocode(locations[i]);
      }
  
  
      function geocode(location) {
          axios.get('https://maps.googleapis.com/maps/api/geocode/json', {
              params : {
                  address: location,
                  key : 'api_key'
              }
          })
              .then(function(response){
                 var lat = response.data.results[0].geometry.location.lat;
                 var lng = response.data.results[0].geometry.location.lng;
                 coordinates.push({&quot;lat&quot; : lat, &quot;lng&quot;: lng});
                 
              })
              .catch(function(error) {
                  console.log(error);
              });
      }
  </code></pre>