I can alert the value but can not return as a value from the function

Question

I want to return a value from my function. When I call the function outside without returning nothing but just alerting the 'res' variable it alerts ok. But when I return the res variable from the function and then alert the entire function it alerts 'undefined'. Why does this happen? I want to mention again that when I alert the res variable everything alerts ok, just that I can not return from function.

  function geocodeLatLng(location, method) {
            var res;
            var geocoder = new google.maps.Geocoder;
            geocoder.geocode(method, function(results, status) {
              if (status === 'OK') {
                if (results[0]) {

                  if(method.address){
                    res = results[0].geometry.location
                    var marker = new google.maps.Marker({
                     position: res,
                     draggable:true,
                     map: map
                   });

                  }

                  else {
                    res = results[0].formatted_address
                  }

                 show_road(results[0].geometry.location);

                } else {
                  window.alert('good');
                }
              } else {
                window.alert('wrong: ' + status);
              }
            });

           return res;
          }

     alert (geocodeLatLng(center, {'location': center}));

fjc · Answer 1 · 2019-06-17T20:32:41.033

geocoder.geocode executes asynchronously and it accepts a callback.

The callback is only called once geocoder.geocode has finished. As it works asynchronously, your return res is executed before res is actually set from within your callback.

A simple workaround is to use async/await with a Promise to wrap your async function:

async function geocodeLatLng(location, method) {
    var geocoder = new google.maps.Geocoder;
    return await new Promise((resolve, reject) => {
        let res;
        geocoder.geocode(method, function(results, status) {
            if (status === 'OK') {
                if (results[0]) {

                    if(method.address){
                        res = results[0].geometry.location
                        var marker = new google.maps.Marker({
                            position: res,
                            draggable:true,
                            map: map
                        });

                    }

                    else {
                        res = results[0].formatted_address
                    }

                    show_road(results[0].geometry.location);

                } else {
                    window.alert('good');
                }
            } else {
                window.alert('wrong: ' + status);
            }
            resolve(res);
        });
    });

}

(async () => {
    const result = await geocodeLatLng(center, {'location': center});
    alert(result);
})();

but please can you help me how can I assign the return value to a variable. Not alerting it. I seem to be unable to assign it — Bre, Jun 17 '19 at 19:59
I've revised my answer. The result is now assigned to a variable `result`. To work with it, you need to be within the anonymous async function. — fjc, Jun 17 '19 at 20:33

I can alert the value but can not return as a value from the function

1 Answers1