1

我对 Javascript 还很陌生,所以如果这个问题已经得到解答,请原谅我,但我无法让它工作,也无法在网上的任何地方找到答案。我正在尝试使用 Google 的 Maps JavaScript API 返回地址。我可以将它打印到内部函数内的控制台,但如果我尝试在该函数之外访问它,它正在打印未定义。如何访问外部函数中的变量并返回它?

    function getAddress(latlng) {
        var address;
        var service = new google.maps.Geocoder();
        
        service.geocode({ location: latlng}, function(results, status) {
            if (status === "OK") {
                if (results[0]) {
                    address = results[0].formatted_address;
                    console.log(address); //prints address
                } 
            }
        });
        console.log(address); //prints undefined
    }
4

1 回答 1

2

问题是一个经典的异步陷阱,address只有在调用回调后才可用,通常,当需要回调时,这意味着不能保证其结果在其执行之外可用,因为我相信有一个网络涉及请求,结果无法及时到达让您立即登录address

var value;
api.thing(callbackThatSetsValue)
console.log(value);

问题的 gits 就在那里:value不能指向任何东西,因为callbackThatSetsValue将在下一行代码执行后调用。

这里至少有 2 个选项,让我们看看它们的样子……

等待结果

此选项允许您在解析地址后执行任何您需要的操作。

function getAddress(latlng, after) {
  var service = new google.maps.Geocoder();
  service.geocode({ location: latlng}, function(results, status) {
    if (status === "OK")
      if (results[0])
        after(results[0].formatted_address);
  });
}

例如,上述实用程序允许您getAddress({lat:50,lng:1}, console.log)传递或传递任何应呈现、使用、显示此类地址的回调。

这种方法的缺陷是 if statusis not OK,你有一个永远挂起的回调,因为它永远不会被调用。

或者,您可以else在该函数中放置一个并传递一个错误,或者null,并在回调中做出相应的反应。

承诺的方式

是这些天最常见的模式,因此我的建议。

function getAddress(latlng) {
  return new Promise(function ($, _) {
    var service = new google.maps.Geocoder();
    service.geocode({ location: latlng}, function(results, status) {
      if (status === "OK")
        if (results[0])
          $(results[0].formatted_address);
      _(new Error("status was " + status));
    });
  });
}

在这种情况下getAddress({lat:50,lng:1}).then(console.log).catch(console.error),您可以在地址无效时进行转义/反应。

于 2020-07-15T17:21:06.060 回答