javascript variable scope: returning variables from nested functions? - Stack Overflow

admin管理员组

文章数量:1429064

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 ments on all lines to explain what I'm thinking.

Thanks very much for any ments/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.

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 ments on all lines to explain what I'm thinking.

Thanks very much for any ments/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.

• javascript
• nested
• scope
• settimeout
• anonymous-function

Share Improve this question Follow edited May 23, 2017 at 12:22 CommunityBot 111 silver badge asked Jun 22, 2012 at 4:25 timtim 3,91355 gold badges3636 silver badges3939 bronze badges 2

• 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 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 Commented Jun 22, 2012 at 5:35

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 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);
});

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.

本文标签： javascript variable scope returning variables from nested functionsStack Overflow