JS Closed Package

absrtact: "If you can't explain to a six-year-old child, you don't really understand it." "Well, I tried to be a 27-year-old friend of the JS closure (JavaScript closure) but failed completely.

More and more feel that there is no teaching atmosphere in the country, in order to understand the closure of JS, I resorted to my English four-class feeding the strength of the search on Google to find the explanation of the closure package, when I saw StackOverflow on this answer, I have a word in mind: this goods did not run!

See below, laughed at.

Peter Mortensen asked:

As Old Albert said, "If you can't explain it to a six-year-old, you don't really understand it." "Well, I tried to be a 27-year-old friend of the JS closure (JavaScript closure) but failed completely.

How would you explain it to a six-year-old curious child?

Note: I've seen the example given on StackOverflow, but it doesn't work.

Ali's Answer:

When function is nested inside the function, it can access the variables in the external function.

function foo (x) {
    var tmp = 3;
    function bar (y) {
         alert (x + y + (++tmp ");
   }
    Bar (10}
Foo (2

Regardless of how many times it is executed, alert 16, because bar can access Foo's parameter x, also can access Foo's variable tmp.

However, this is not a closure. When you return an internal function, it is a closed packet. The internal function close-over the variables of the external function until the internal function ends.

function foo (x) { VarTmp=3     return Function (y) {
        alert (x + Y " Span style= "color: #000000;" >+ (++tmp ");
   }
}
var bar = foo (2// bar is now a closure
bar (10

The above script will eventually be alert 16, because although bar is not directly in the internal scope of Foo, bar still has access to X and TMP.

However, since TMP still exists inside the bar closure, it will add 1, and it will add 1 each time you call bar.

(considering the six-year-old limit: we can actually create more than one closure method, such as return their arrays, or set them as global variables.) They all point to the same x and the same TMP, rather than having a copy of each. ）

Note: Now for the whole seven-year-old content.

The above x is a literal (value pass), like other literals in JS, when you call Foo, the value of the argument x is copied, and the copy is the parameter X of foo.

So the problem is, JS in the processing of object is used to pass the reference, then, you call Foo when you pass a Object,foo function return of the closure will also refer to the original object!

functionFoo (x) {
VarTmp=3;
Returnfunction(y) {
Alert (x+Y+TMP);
X.memb=X.memb? X.memb + 1: 1     alert (X.MEMB);
   }
}
var age =< Span style= "color: #0000ff;" > New number (2 var bar = Foo (age); // bar is now an age-referenced closure Bar (10

Not surprisingly, every time we run bar, X.MEMB will add 1. However, it is important to note that x each time it points to the same object variable--age, running two times bar (10), Age.memb becomes 2.

This is related to the memory leak of the HTML object, well, but it seems beyond the scope of the answer.

Johnmerlino said to Ali:

Here is an example of a closure without the return keyword:

function closureexample (ObjID, text, Timedelay) {
SetTimeout (function() {
document.getElementById (ObjID). InnerHTML = text;
}, Timedelay);
}
Closureexample (' mydiv ', ' Closure is created ', $);

Late at night 1:37 John pick this answer:

The function in JS can access them:

1. Parameters

2. Local variables or functions

3. External variables (environment variables?) ), including

3.1 Global variables, including DOM.

3.2 Variables or functions for external functions.

If a function accesses its external variables, it is a closed packet.

Note that external functions are not required. By accessing an external variable, a closure can maintain (keep alive) these variables. In an example of intrinsic and external functions, an external function can create a local variable and eventually exit, but if any one or more intrinsic functions do not exit after it exits, the intrinsic function maintains local data for the external function.

A typical example is the use of global variables.

Mykhal this answer:

Wikipedia's definition of closures is this:

In computer science, a closure are a function together with a referencing environment for the nonlocal names (free variable s) of that function.

Technically, in JS, each function is a closure, because it always has access to the data defined outside it.

Since scope-defining Construction in Javascript are a function, not a code block like in many other languages, what we usually mean by closure in Javascript are a fuction working with nonlocal variables defined in a Lready executed surrounding function.

Closures are often used to create functions that contain hidden data (but not always).

VarDb=(function() {
//Create a hidden object, this object holds some data
//This object cannot be accessed from outside.
VarData={};
//Create a function that provides some way to access data
Returnfunction(Key, Val) {
If(Val===Undefined) {ReturnData[key]}//Get
Else{ReturnData[key]=Val}//Set
}
//We can call this anonymous method
//Return this intrinsic function, which is a closed packet
})();

db‘X‘);//Back to undefined
db ('x', 1); // set data[' x '] to 1
db ('x'); // return 1
We can't access data, the object itself.
// But we can set up a member of it

JS Closed Package