[Label] [JavaScript] Closures Read notes

original link Source: http://www.ruanyifeng.com/blog/2009/08/learning_javascript_closures.html

//Global variables can be read directly inside the function
varn = 999;
functionF1 () {
alert (n);
}
F1 ();//999


//variables inside the function cannot be read outside the function, and Var must be used when declaring variables inside the function.
//if not, it is equivalent to declaring a global variable.
functionF2 () {
varn = 999;
}
alert (n);

//ff:referenceerror:n is not defined
//chrome:uncaught referenceerror:n is not defined
//ie8:n is undefined

//If a variable is declared inside a function without using VAR, it is equivalent to declaring a global variable.
functionF3 () {
n = 999;
}
F3 ();// 
alert (n);


//without declaring a global variable, how can we read the variables inside the function?
//A workaround is to define a function inside the function.

functionF4 () {
varn = 999;
functionF5 () {
alert (n);//999
}
F5 ();
}
F4 ();

/*
The function F5 is included inside the function F4, at which point all local changes within the F4 are visible to the F5. But in turn, the local variables inside the F5 are not visible to F4. This is the JavaScript-specific "chain-scoped" structure (chain scope), where child objects look up the variables of all the parent objects one level at a level. Therefore, all the variables of the parent object are visible to the child object, and vice versa.
*/
//since F5 can read the local variables in the F4, we can not read its internal variables outside the F4 as long as the F5 is the return value.

functionF4 () {
varn = 999;
functionF5 () {
alert (n);
}
returnf5;
}

varresult = F4 ();
Result ();
//the F5 function in the above code is the closure.
//closures are functions that can read other functions ' internal variables.
//since in the JavaScript language, only the functions inside the function can read local variables, the closure can be simply understood as "a function defined inside a function".
//so, in essence, a closure is a bridge that connects the inside of the function to the outside of the function.

//the largest use of closures, one is the ability to read variables inside the function, and the other is to keep the values of these variables in memory at all times.
functionF6 () {
varn = 999;
Nadd =function() {
N+=1;
Console.log ( This);//Object window
};
functionF7 () {
alert (n);
Console.log ( This);//Object window
}

returnF7;

}

varresult = F6 ();
Result ();//999
Nadd ();
Result ();// +

//result is actually the closure function F7, which runs two times, the first value is 999, the second value is 1000. This proves that the local variable n in the function F6
//Is kept in memory and is not automatically cleared after the F1 call has ended.
//why is that? The reason for this is that F6 is the parent function of F7, and F7 is assigned to a global variable, which causes F7 to always be in memory, and F7 's presence depends on F6, so
//F6 is also always in memory and will not be reclaimed by the garbage collection mechanism (garbage collection) after the call ends.
//the JavaScript garbage collection mechanism (garbage collection) rule is no longer called by the object.
//The var keyword is not used in front of Nadd, so Nadd is a global variable, not a local variable. Second, the value of the Nadd
//is an anonymous function (anonymous functions), which is itself a closed packet.
//the function of Nadd is equivalent to a setter, which can manipulate variables inside the function outside of the function.

//note points for using closures:
//1. Variables in the function are stored in memory and memory consumption is large, so it cannot be abused, and the workaround is to remove all unused local variables before exiting the function.
//2. Closures will change the value of the internal variables of the parent function outside the parent function. If the parent function is used as an object, use the closure as its common method
//be careful not to change the value of the inner variable of the parent function by taking it as its private property.

varName = ' The Window ';

varobj = {
Name: ' My Object ',
Getnamefunc:function() {
returnfunction() {
return This. Name;
}
}
}

Alert (Obj.getnamefunc () ());
//The call to the Getnamefun method object is obj, which returns an anonymous function (anonymous functions) as a
//global variable, whose calling object is window, so the output is "the window"

varName = ' The Window ';

varobj = {
Name: ' My Object ',
Getnamefunc:function() {
varthat = This;
returnfunction() {
returnThat.name;
}
}
}

Alert (Obj.getnamefunc () ());//output:my Object

[Label] [JavaScript] Closures Read notes