variable scope in asynchronous function

Question

I\'ve built the function to return some variable. But my function uses another function asynchronously.

function getVariable() {
  var myVariable;
  asyncronousF         


        

Answer 1

They are the same variable, but you cannot return the result of an asynchronous function call synchronously from your getVariable function. The value of myVariable will be updated asynchronously at some unspecified later point in time. But your function is returning the value now. That doesn't work.

That means your getVariable function is asynchronous as well, which means you have to design it that way. For example it could accept a callback, just like asyncronousFunction does.

Answer 2

They are not different variables, it is the same variable... but you haven't assigned a value to myVariable before you return it at the end of the function.

The correct pattern here would be for getVariable and asychronousFunction to accept callbacks, which are executed when the asynchronousFunction has finished executing.

function getVariable(callback) {
  var myVariable;
  asyncronousFunction(function(/* pass callback as one of the parameters */){

    myVariable = ...

  });

  // Don't return myVariable, as it's useless at this point
};

function asyncronousFunction(callback) {
   // This simulates the asynchronous call. When the call finishes, invoke callback and pass the result as a parameter.
   setTimeout(function () {
        callback("result");
   }, 1000);
}

You should then edit how you use the function getVariable().

So where you might have had:

var value = getVariable();
// do whatever with value
value++;

You should now have:

getVariable(function (value) { // value is now passed as a parameter
    value++;
});