javascript variable scope: returning variables from nested functions?

Question

I looked at this: Returning values from nested functions in Javascript

but it did not really help me (or I am just too dumb to get it).

My variable scope is somehow off and I don't understand why. My alert() does not behave as expected. Tried to add comments on all lines to explain what I'm thinking.

Thanks very much for any comments/pointers/answers!

var g = {}; / is a large object with all kinds of other stuff and functions in it

g.ding = function(){ // my problem function
 var baby = 'young'; // i thought I set a local var here
    if(someVar==true) { // standard issue if statement
        someAPI.class( // using an API that uses a function as its attribute
            function(stuff){ // my anonymous function
                baby = 'old'; // setting the var to something
            }
        );
    }
    return baby; // returning the var
}

alert( g.ding() ); // i expect it to say "old" but it keeps saying "young". why?

NEW EDIT: Juan's accepted answer is great, but isn't there also a way to use setTimeout() to deal with asynchronous function calls and essentially making them synchronous? if anyone who reads this knows the answer I'd love to know. Thanks.

Most likely, because function(stuff) is never being run. Your scoping looks fine. Nothing here proves that the line of code that sets baby="old" is ever executed. someVar could be false, or someAPI could never call the function you pass it. — Jamie Treworgy
– Jamie Treworgy, Commented Jun 22, 2012 at 4:29
well, I originally did check with an alert() that this function is being called. I think the async element of the API function is the solution. — tim
– tim, Commented Jun 22, 2012 at 5:35

Ruan Mendes · Accepted Answer · 2012-06-22 17:07:50Z

7

The call to someAPI.class(function(){}) is probably asynchronous, that means the function you pass into it may not have been called when someAPI.class() returns and the variable hasn't been changed.

The solution is to pass the variable back in a callback

g.ding = function(callback){ 
    var baby = 'young';
    if(someVar) {
        someAPI.class(
            // There's no guarantee of when this function is called
            function(stuff){
                baby = 'old';
                // Call the callback, it's like a return, for async functions
                callback(baby);
            }
        );
    }
    // the inner function probably wasn't called yet, 
    // doesn't make sense to return this here
    // return baby;
}

// Then you'd call it like this, as soon as you use an async function
// all the functions that call it have to use callbacks for return values
g.ding(function(value){
    alert(value);
});

edited Jun 22, 2012 at 17:07

answered Jun 22, 2012 at 4:33

Ruan Mendes

92.7k31 gold badges161 silver badges225 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

tim Over a year ago

thanks a bunch Juan, this definitely made it clear for me. Always struggle with async.

Ruan Mendes Over a year ago

@tim BTW, class is a reserved keyword and should not be used as a property name (unless you always use it with someAPI["class"]() I'm hoping that's not the real name of the method you're calling

tim Over a year ago

Juan, thanks yes I know that about 'class' - I was simplifying the code sample for clarity's sake.

me_digvijay · Accepted Answer · 2012-06-22 05:10:17Z

0

Here I can think that your

 someAPI.class();

must be an event related function (like click, mouseover etc.). So the function inside it will be performed only when the related event occurs and hence change the value of the variable. But I think the event does not occur and hence the variable will not change.

answered Jun 22, 2012 at 5:10

me_digvijay

5,53210 gold badges51 silver badges86 bronze badges

Collectives™ on Stack Overflow

javascript variable scope: returning variables from nested functions?

2 Answers 2

3 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related