функция JavaScript возвращает неопределенный

Question

Я пытаюсь реализовать карты Google, и у меня проблема в том, что когда я вызываю функцию getLatLng, она возвращает неопределенное значение, и я не могу понять, почему.

    initialize();

    var map;
    var geocoder;   

    function initialize() {

        geocoder = new google.maps.Geocoder();
        var address = "Rochester, MN";
        var myLatLng = getLatLng(address);
        console.log("myLatLng = "+myLatLng);

    }

    function getLatLng(address) {

        var codedAddress;

        geocoder.geocode({'address': address}, function(results, status) {

            if(status == google.maps.GeocoderStatus.OK) {
                codedAddress = results[0].geometry.location;
                console.log("codedAddress 1 = "+codedAddress);
            } else {
                alert("There was a problem with the map");
            }
            console.log("codedAddress 2 = "+codedAddress);
        });

        console.log("codedAddress 3 = "+codedAddress);
        return codedAddress;
    }

В консоли Firebug вот вывод, который я получаю в этом точном порядке:

codedAddress 3 = undefined
myLatLng = undefined
codedAddress 1 = (44.0216306, -92.46989919999999)
codedAddress 2 = (44.0216306, -92.46989919999999)

Почему в консоли сначала отображаются codedAddress 3 и myLatLng?

Answer 1

geocode является асинхронным (т. Е. отправляет запрос на серверы Google ), поэтому вам нужно передать функцию обратного вызова на getLatLng, вместо того, чтобы немедленно возвращать ее:

function getLatLng(address, callback) {
    var codedAddress;

    geocoder.geocode({'address': address}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            codedAddress = results[0].geometry.location;
            console.log("codedAddress 1 = "+codedAddress);
        } else {
            alert("There was a problem with the map");
        }
        console.log("codedAddress 2 = "+codedAddress);

        callback(codedAddress);
    });
}

Answer 2

Вот что я получил, работая с документацией Google Maps:

  var geocoder;
  var map;

  function initialize() {
    geocoder = new google.maps.Geocoder();
    var address = "Rochester, MN";
    var latlng = codeAddress(address);
    var myOptions = {
      zoom: 8,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
  }

  function codeAddress(address) {
    geocoder.geocode( { 'address': address}, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
        map.setCenter(results[0].geometry.location);
        var marker = new google.maps.Marker({
            map: map,
            position: results[0].geometry.location
        });
      } else {
        alert("Geocode was not successful for the following reason: " + status);
      }
    });
  }

Вот jsFiddle, чтобы увидеть его в действии. Очевидно, вы можете обновить его, чтобы использовать jQuery, если вам нужно.

Answer 3

Вам не хватает закрывающей } для функции инициализации.