Javascript函数没有正确返回对象

javascript function not correctly returning an object

本文关键字：返回 对象 函数 Javascript      更新时间：2023-09-26

我没主意了。我有一个javascript函数返回一个对象，但是控制台一直抱怨一个未捕获的TypeError:无法正确读取未定义....的'lat'从控制台转储中，我可以看到所有内容都正确地传递到函数中，并且可以看到该函数正在正常工作。问题在于退货。我不确定是什么问题，这似乎相当直接。旁注，我正在与谷歌地图/地理代码api工作。

    function locate(val) {
        console.log(val);
        geocoder = new google.maps.Geocoder;
        geocoder.geocode({'address': val}, function(results, status) {
            if (status == 'OK') {
                var lat = results[0].geometry.location.lat();
                var lng = results[0].geometry.location.lng();
                var pos = {
                    lat: lat,
                    lng: lng
                };
                console.log('lat: ' + pos.lat);
                console.log('lng: ' + pos.lng);
                return pos;
            }
            else {
                alert('Geocode was not successful for the following reason: ' + status);
                return null;
            }
        });
    }
    for (i = 0; i < address.length; i++) {
        var coord = locate(address[i].toString());
        var lat = coord.lat;
        var lng = coord.lng
        console.log(lat);
    }

如果错误发生在for循环中的var lat = coord.lat，我想这是因为您试图在geocode回调执行之前访问coord。

这个问题是由异步引起的。

对于异步行为的更一般的解释例如，请参阅为什么我的变量在我修改后没有改变在函数内部?-异步代码引用

你可以这样做来解决它。

function locate(val, callback) {
    console.log(val);
    geocoder = new google.maps.Geocoder;
    geocoder.geocode({'address': val}, function(results, status) {
        if (status == 'OK') {
            var lat = results[0].geometry.location.lat();
            var lng = results[0].geometry.location.lng();
            var pos = {
                lat: lat,
                lng: lng
            };
            console.log('lat: ' + pos.lat);
            console.log('lng: ' + pos.lng);
            return pos;
        }
        else {
            alert('Geocode was not successful for the following reason: ' + status);
            return null;
        }
    });
}
function mycallcack(coord)
{
        var lat = coord.lat;
        var lng = coord.lng
        console.log(lat);
}
for (i = 0; i < address.length; i++) {
    locate(address[i].toString(), mycallback(coord));
}

我今天遇到了一个类似的问题，问题是geocode方法不同步运行，所以有一个回调函数。回调函数中的return语句不会返回给locate方法的调用方。

解决这个问题的方法是使用承诺。如果你正在使用jQuery，那么你可以…

function locate(val) {
    console.log(val);
    var dfd = $.Deferred();
    geocoder = new google.maps.Geocoder;
    geocoder.geocode({'address': val}, function(results, status) {
        if (status === 'OK') {
            var lat = results[0].geometry.location.lat();
            var lng = results[0].geometry.location.lng();
            var pos = {
                lat: lat,
                lng: lng
            };
            console.log('lat: ' + pos.lat);
            console.log('lng: ' + pos.lng);
            dfd.resolve(pos);
        }
        else {
            dfd.reject('Geocode was not successful for the following reason: ' + status);
        }
    });
    return dfd.promise();
}
for (i = 0; i < address.length; i++) {
    locate(address[i].toString())
      .then(function(coord) {;
        var lat = coord.lat;
        var lng = coord.lng;
        console.log(lat);
      })
      .catch(function(reason) {
        console.log(reason);
      });
}

或者在ES6中:

function locate(val) {
  return new Promise((resolve,reject) => {
    geocoder = new google.maps.Geocoder;
    geocoder.geocode({'address': val}, (results, status) => {
        if (status === 'OK') {
            var lat = results[0].geometry.location.lat();
            var lng = results[0].geometry.location.lng();
            var pos = {
                lat: lat,
                lng: lng
            };
            resolve(pos);
        }
        else {
            reject('Geocode was not successful for the following reason: ' + status);
        }
    });
  }
}
for (i = 0; i < address.length; i++) {
    locate(address[i].toString())
      .then(coord => {;
        var lat = coord.lat;
        var lng = coord.lng;
        console.log(lat);
      })
      .catch(reason => {
        console.log(reason);
      });
}
相关文章：