Asynchronous execution of a function passed as an argument
<p>I'm facing the following problem. I want to use Google's geocoding service to draw some markers on the map. However, the marker is instantiated before geocoding even finished it's job. <code>drawMarker</code>  function will return a <code>Marker</code> with <code>location</code> undefined.</p>

<p>I tried passing the geocoding function as an argument to <code>drawMarker</code> function, and executing it there. I thought that this way I'd achieve synchronous behaviour, which is not the case. Simplified code follows:</p>

<pre><code>drawMarker(i, map, codeAddress, locationsToConvert[i]);

function drawMarker(i, map, func, arg) {
    var location = func.apply(this, [arg]);
    return new google.maps.Marker({
        position: {lat: location.lat, lng: location.lng},
        map: map,
        html: locations[i][0],
        id: i
    });
}

function codeAddress(address) {
    geocoder.geocode( { 'address': address}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            return results[0].geometry.location
        }
    });
}
</code></pre>

<p>What are my solutions, which one's best, perhaps:</p>

<ul>
<li>using the Promise interface?</li>
<li>doing everything in one function and instantiating <code>Marker</code> in the callback of the geocode service?</li>
<li>other?</li>
</ul>