无法修改 javascript 中的全局变量

Question

var address ="<%= params[:search] %>";
var lat;
var long;
var geocoder = new google.maps.Geocoder();
geocoder.geocode( { 'address': address}, function(results, status) {
 lat = results[0].geometry.location.lat();
 long = results[0].geometry.location.lng();
}); 
alert(lat);
//wanna use lat and long here!

浏览器在函数外部调用时始终提示 "undefined"，在函数内部调用时有效。

Answer 1

你好Ashutosh Gupta,

发生这种情况是因为您的 alert() 发生在变量赋值之前。您可以使用 Promise 来解决这个问题，例如

var address ="<%= params[:search] %>";
var lat;
var lng;
var geocoder = new google.maps.Geocoder();

new Promise((resolve, reject) => {
geocoder.geocode( { 'address': address}, function(results, status) {
    lat = results[0].geometry.location.lat();
    lng = results[0].geometry.location.lng();
    resolve({lat: lat, lng: lng});
}));
}).then((data) => {
    alert(data);
});

Answer 2

geocoder.geocode 函数是异步的，它在回调函数中接收纬度和经度 - 在异步操作完成后。只有这样 lat 和 long 变量才被定义。

您的警报会在开始异步操作后立即运行，这意味着在触发警报时它仍未完成。因此，lat 和 long 仍未定义。

您不能在回调块之外使用纬度和经度。将它移到回调块中，它将起作用：

var address ="<%= params[:search] %>";
var lat;
var long;
var geocoder = new google.maps.Geocoder();
geocoder.geocode( { 'address': address}, function(results, status) {
    lat = results[0].geometry.location.lat();
    long = results[0].geometry.location.lng();
    // you can use lat and lng inside here! :)
    alert(lat);
});

如果您想更好地理解 JavaScript 中的异步代码，请阅读此 post：

无法修改 javascript 中的全局变量

unable to modify global variable in javascript

javascript

google-maps

ruby-on-rails

google-maps-api-3

geocode