what's the meaning of the closures in javascript?

Question

refer from the internet

it said it can access the function inside value from outside like this:

function a(){           
    var scope = "local scope";
    function f(){return scope;}    
    return f; 
} 
console.log(a()());//it can get the value 'local scope'

my question is what's the different with this code

function a(){           
    var scope = "local scope"; 
    return scope; 
} 
console.log(a());//it can get the value 'local scope' too

so what's the meaning of the closures?

why need to return the value by wrap the function?

How did you get the impression that you _"need"_ to code that way? — Cerbrus, Sep 02 '15 at 09:55
You don't have to do that unless you have to. The same way you don't need to use `Math.random` until you need a random number. — zerkms, Sep 02 '15 at 09:57
Possible duplicated of [how-do-javascript-closures-work](http://stackoverflow.com/questions/111102/how-do-javascript-closures-work) and several others — David, Sep 02 '15 at 09:57
@David it seems like OP is more confused with concept of higher order functions rather than closures themselves. — zerkms, Sep 02 '15 at 09:58
the problem is , `Math.random` can give me a random number in easy way. so is it something good when use closures to get the `scope`? @zerkms — chanjianyi, Sep 02 '15 at 10:05
@chanjianyi the same story here: when you need to return a function - you return a function, when you need to return a random number - you return a random number. — zerkms, Sep 02 '15 at 10:07
Guys do you really not read further than the question title? — zerkms, Sep 02 '15 at 10:15

score 1 · Accepted Answer · edited May 23 '17 at 11:52

Here is a possible use of a closure:

var getUid = function () {
    var uid = 1;
    return function () {
        return uid++;
    };
};

// invoke the wrapping function immediately
// to create a single local scope
getUid = getUid();

getUid(); // 1
getUid(); // 2
getUid(); // 3

As you can see, the closure allows to keep the "uid" local variable "alive" between function calls. Its value is retained in memory, it is persistent, unlike when there is no inner function:

var getUid = function () {
    var uid = 1;
    return uid++;
};

getUid(); // 1
getUid(); // 1
getUid(); // 1

To summarize, the interesting stuff about closures is the ability to make local variables persistents.

In your example there is something that is worth being noticed though. Pay attention to the fact that writing a()() is the same as writing (a())(). This means that you call the wrapping function "a" first, which creates a new scope, thus, everything inside "a" is entirely recreated.

If you keep creating new scopes this way, there is no reason to use a closure. Indeed, doing this you loose the abilty to keep variables alive between function calls (as explained above). Let's see what would happen to getUid() if used this way:

var getUid = function () {
    var uid = 1;
    return function () {
        return uid++;
    };
};

getUid()(); // 1
getUid()(); // 1
getUid()(); // 1

Same result as if there was no inner function. Not very useful right? However, you can still take advantage of calling the wrapping function repeatedly if you need to create multiple scopes, but you'll have to store inner functions into variables:

var getUidA = getUid(); // scope A
var getUidB = getUid(); // scope B

getUidA(); // A 1
getUidA(); // A 2
getUidB(); // B 1
getUidA(); // A 3
getUidB(); // B 2

I'm not sure there is much more to say regarding the fundamentals of closures, fellow programmers will judge. Anyway, if you feel ready for headaches, you might be interested in what's going on at low level in memory: https://stackoverflow.com/a/31778897/1636522.

thanks, that's very helpful for me! from your answer, my understanding is that the closures can create something like object, like your `getUidA ` and `getUidB ` can store their own status independently — chanjianyi, Sep 06 '15 at 06:49
@chanjianyi I suppose we can say that :-) But I won't encourage you to use it to emulate objects. I don't know if it's such a bad practice, but it is not a common practice at least :-/ Anyway, don't be afraid to ask if there are still grey areas :-) — , Sep 06 '15 at 07:02
XD I found a reference seems good: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures — chanjianyi, Sep 06 '15 at 07:35
@chanjianyi I was about to share it with you :-D But I was trying to improve these old answers first: http://stackoverflow.com/a/20338699/1636522 and http://stackoverflow.com/a/20138888/1636522 :-) — , Sep 06 '15 at 08:23

score 0 · Answer 2 · edited May 23 '17 at 11:44

For what is closure read this one, best explained
JavaScript closures vs. anonymous functions

function a(){           
    var scope = "local scope"; 
    return scope; 
} 
console.log(a());

In this case you can only return the local variable you cant apply any operation on variable if you need any

function a(){           
    var scope = "local scope";
    function f(b){return scope + b;}    
    return f; 
} 
console.log(a()('found here'));
console.log(a()(' not found here'));

But in this case you can manipulate that data if you need it.

I mean to say that we can be need of closure.

what's the meaning of the closures in javascript?

2 Answers2