JavaScript-全局变量显示为未定义

Question

关于这个话题有很多话题，但是我仍然找不到适合我的情况的答案...

这是我想要做的：

1）定义一个函数，以使用Google Maps API v3获取地理编码

2）使用有问题的地址调用该函数，以便获取该特定地址的地理编码

如果我放置该代码，可以很好地工作

    alert(address); 

后

    address = results[0].geometry.location;

由于我需要将其作为全局变量，因此不幸的是这不是一种选择。 当试图使用'address'变量作为全局函数时，我总是得到'undefined'值。

<!DOCTYPE html>
<html>
<head>
  <script src="http://maps.googleapis.com/maps/api/js?sensor=false"
      type="text/javascript"></script>
</head>

  <script type="text/javascript">
    var geocoder;
    var address;

     address = 'Frankfurt, Germany';

  function codeAddress() {
    geocoder = new google.maps.Geocoder();
    geocoder.geocode( { 'address': address}, function(results, status) {
  if (status == google.maps.GeocoderStatus.OK) {

address = results[0].geometry.location;


  } else {
    alert("Geocode was not successful for the following reason: " + status);
      }
    });
  }

codeAddress(address);
alert(address);

  </script>


</body>
</html>

有人能帮助我吗？ 盯着代码似乎并没有帮助我。 我感谢所有可用的帮助，谢谢！！！

Answer 1

问题是geocode是异步的 ，不是吗？

这意味着在首次调用原始帖子中的外部更改之后，将在“稍后某个时间”调用地理编码回调。 （它不应该警告未定义，因为它首先被设置为特定的字符串，所以我忽略了该语句。）

function codeAddress() {
  geocoder = new google.maps.Geocoder();
  geocoder.geocode( { 'address': address}, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      // Only use address *after the callback success* and get rid of
      // the global variable if possible - note how it's just passed here.
      // You can use `debugger;` to stop here and check the value to
      // make sure it is set as appropriate.
      var address = results[0].geometry.location;
      alert(address);
      doOtherStuffWithAddress(address);
    } else {
      alert("Geocode was not successful for the following reason: " + status);
    }
  });
}

function doOtherStuffWithAddress (address) {
   // don't need no stinking globals
}

请参阅如何从AJAX调用返回响应？ ：

AJAX中的A代表异步。 这意味着发送请求（或接收响应）已从正常执行流程中删除。 在您的示例中，$。ajax立即返回，下一条语句返回result;在您作为成功回调传递的函数被调用之前执行。

并专门针对上下文：

地理编码功能是异步的。 这意味着发送请求（或接收响应）已从正常执行流程中删除。 在您的示例中，地址解析立即返回，并且在调用作为成功回调传递的函数之前，将执行下一条语句alert（address）。

Answer 2

谢谢你们的回答。 现在，我可以完成我的项目了！！！ 在下面找到我的最终代码。 该代码填充地址数组的地址解析。 玩得开心。

<!DOCTYPE html>
<html>
<head>
  <script src="http://maps.googleapis.com/maps/api/js?sensor=false"
          type="text/javascript"></script>
</head>
<BODY>
<DIV ID="pro"></div>
<DIV ID="adr"></div>

  <script type="text/javascript">
    var geocoder;




var addresses = "Berlin, Deutschland; Frankfurt, Deutschland; Broadway Street, New York City, New York, USA";


 geocoder = new google.maps.Geocoder();

var address = addresses.split(';');

var i = 0;
var timeout = 600;


codeAddress(i);


function codeAddress(i) {


    geocoder.geocode( { 'address': address[i]}, function(results, status) 
    {
            if (status == google.maps.GeocoderStatus.OK) {
            document.getElementById("adr").innerHTML = document.getElementById("adr").innerHTML + "<BR>{location: new google.maps.LatLng" + results[0].geometry.location + ", weight: 1},";

                                } else {
                if (status == google.maps.GeocoderStatus.OVER_QUERY_LIMIT)
                    {
                        setTimeout(function() { addMarker(position); }, (timeout * 3));
                    }
                                        }


i++;
var percent = ((i) / address.length) * 100;
percent = percent.toFixed(2);
percent = percent + " %";
document.getElementById("pro").innerHTML = percent; 


if (i < address.length)
        {
            setTimeout(function() { codeAddress(i); }, (timeout));
         }

    });



            }

</script>


</body>
</html>