Eu tenho lutado com isso por um tempo agora. Sou novo em JavaScript e tenho a impressão de que o código que tenho escrito está sendo executado de forma assíncrona. Aqui está um exemplo genérico:

Eu corro algum código na função a. A função A chama a função B, que precisa retornar uma variável para A, de modo que A possa usá-la em suas operações posteriores. No entanto, parece que quando A chama B, ele ainda continua a executar seu próprio código, não esperando bloqueado por seu valor de retorno, e B não é rápido o suficiente para que A termine atingindo o ponto em que precisaria usar o retorno valor e eu recebo umerro de tipo de variável indefinido.

A maneira que eu tenho trabalhado em torno disso é ter a função A chamada de função B, que chama uma função C que faria o que as operações posteriores que A estaria fazendo com o valor de retorno .... Eu meio que serializando meu código através de chamadas em vez de devoluções ... isso é complicado ...

Aqui está um exemplo de quando isso acontece no código real:

function initialize() {
    //Geocode Address to obtin Lat and Long coordinates for the starting point of our map
    geocoder = new google.maps.Geocoder();
    var results = geocode(geocoder);
    makeMap(results[0].geometry.location.lat(), results[0].geometry.location.lng());

}

function geocode(geocoder) {
    //do geocoding here...

    var address = "3630 University Street, Montreal, QC, Canada";
    geocoder.geocode({ 'address': address }, function (results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
           return results;
            }
         else {
            alert("Geocode was not successful for the following reason: " + status);
        }
   });

}

function makeMap(lat, long) {
  //  alert(lat); for debuging
    var mapOptions = {
        center: new google.maps.LatLng(lat, long),
        zoom: 17,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
     map = new google.maps.Map(document.getElementById("map_canvas"),
        mapOptions);
}

Nota: initialize é chamado pelo corpo onload = "initialize ()" no meu html.

Portanto, o problema é que o makeMap requer os valores de latitude e longitude obtidos pela função Geocode, mas recebo um erro no console dizendo que os resultados são indefinidos. O que está acontecendo? Eu vim do Java, então estou um pouco confuso sobre como o fluxo de dados está acontecendo aqui no JS! Estas serão lições valiosas para o futuro!

Em uma pergunta secundária: Como devo dividir minhas funções em scripts externos? O que é considerado boa prática? todas as minhas funções devem estar amontoadas em um arquivo .js externo ou devo agrupar funções semelhantes?