0

When I run this, the variable elevationPoint is undefined on the first alert. I noticed by accident that it works on the second alert. Why is that?

var elevator = new google.maps.ElevationService();
var coordinates = new google.maps.LatLng(closestLat , closestLng);
var pointElevation;
elevator.getElevationForLocations({
    'locations':[coordinates]
    }, function (results, status) {
    if (status == google.maps.ElevationStatus.OK) {

        // Retrieve the first result
        if (results[0]) {
            pointElevation = results[0].elevation;
           
        } else {
            alert('No results found');
        }
    }
    else {
        alert('Elevation service failed due to: ' + status);
    }
});
alert(pointElevation);
alert(pointElevation);
mfp
  • 13
  • 4

2 Answers2

0

Because pointElevation is defined inside an asynchronous call getElevationForLocations(). By chance the 2nd alert works it is because the async call has finished by then, but it is not guaranteed.

DJ.
  • 6,664
  • 1
  • 33
  • 48
0

The fact that you pass a callback to API that you are using makes me think that it is asynchronous.

When you make the first alert the asynchronous task has not completed yet . By the time the second alert fires the callback has completed and you get the expected value on the variable that youbexoex. Try moving the alert inside the function you pass to the API and it should work.

Regards

Edit to clarity the blocking/non-blocking topic

Functions requiring callbacks are usually asynchronous,and they run on a separate thread called the eventLoop. The code is executed immediately after evaluation, so your API call fires immediately and it is placed on the event loop. When the first alert is reached the asynchronous operations are already on the eventLoop, so although the alert is blocking it can not block the code running on a separate thread. When the second alert is executed the asynchronous code has already completed and the callback executed ,that's why you can see the value on the second alert .

I recommend you investigate about the event loop and how it works This is a fantastic visual explanation https://m.youtube.com/watch?v=8aGhZQkoFbQ

Danielo515
  • 5,996
  • 4
  • 32
  • 66
  • How can any callback run. It can not run while the alert is up as it is blocking, and it can not run between the first and second alert as that is also blocking. No events can execute until the whole script block has been executed. – Blindman67 Jan 25 '17 at 21:23
  • @Blindman67 as Danielo515 said, the API is async call so it is not blocking. Passing callback does not guarantee it is an async call, but most async call use callback mechanism. – DJ. Jan 25 '17 at 21:31
  • @DJ What you mean a async function is called? https://tc39.github.io/ecma262/#sec-async-function-definitions I am unaware of any method that allows code execution to be interrupted and state to be change mid execution. I have searched high and low for that possibility, could you point to where I can learn how to do that. – Blindman67 Jan 25 '17 at 22:16
  • @DJ on further investigation. There is no way to interrupt execution and hence the current state. To change the variable `pointElevation` requires the execution of the callback function. That can not happen between the two alerts as both the alerts and the block they are running in are blocking. Nothing but the second alert will ever happen after the first. If you claim it can please provide evidence to back that claim. – Blindman67 Jan 25 '17 at 22:28
  • @Blindman67when I wrote async function, I meant generic function that behave asynchronously (non-blocking), not function marked with _async_ keyword that you linked, although they are related. See http://stackoverflow.com/questions/23667086/why-is-my-variable-unaltered-after-i-modify-it-inside-of-a-function-asynchron on JavaScript async function. – DJ. Jan 26 '17 at 00:00
  • @Danielo515 Thank you. That was very helpful. – mfp Jan 27 '17 at 17:02
  • @mfp maybe you can accept the answer if it was helpful ? :-) – Danielo515 Jan 27 '17 at 17:28