What is a closure?
Let's look at a piece of code first:
function a(){ var n = 0; function inc() { n++; console.log(n); } inc(); inc(); }a(); //Console outputs 1, then outputs 2It's simple. Let's look at another piece of code:
function a(){ var n = 0; this.inc = function () { n++; console.log(n); };}var c = new a(); c.inc(); //Console output 1c.inc(); //Console output 2It's simple.
What is a closure? This is the closure!
Functions that have access to variables within the scope of another function are closures. Here the inc function accesses the variable n in the constructor a, so a closure is formed.
Let's look at another piece of code:
function a(){ var n = 0; function inc(){ n++; console.log(n); } return inc;}var c = a();c(); //Console output 1c(); //Console output 2Let's see how it is executed:
var c = couter(), this sentence couter() returns the function inc, then this sentence is equivalent to var c = inc;
c(), this sentence is equivalent to inc(); note that the function name is just an identifier (a pointer to a function), and () is the execution function.
The next three sentences translated into: var c = inc; inc(); inc();, is there any difference between it and the first piece of code? No.
What is a closure? This is the closure!
All textbook tutorials like to use the last paragraph to illustrate closures, but I think this complicates the problem. What is returned here is the function name. Students who have never seen Tan Haoqiang's C/C++ programming may not immediately reflect the difference between bringing () or not, which means that this writing method comes with a trap. Although this writing method is more prominent, I still like to singularize the problem and look at code 1 and code 2. You will still be confused about the call of function, will you be confused about the value of n?
Why do you need to write like this?
We know that each function of js is a small black room. It can obtain external information, but the outside world cannot directly see the content inside. Putting the variable n into a small dark room, except for the inc function, there is no other way to get in touch with the variable n. Moreover, defining the variable n with the same name outside the function a does not affect each other. This is the so-called enhancement of "encapsulation".
The reason why you need to use return to return function to identify inc is because the inc function cannot be called directly outside the a function, so return inc is associated with the outside. This in code 2 also only associates inc with the outside.
Common traps
Check out this:
function createFunctions(){ var result = new Array(); for (var i=0; i < 10; i++){ result[i] = function(){ return i; }; } return result;}var funcs = createFunctions(); for (var i=0; i < funcs.length; i++){ console.log(funcs[i]());}At first glance, I thought it was outputting 0~9, but I never expected it to output 10 10?
The trap here is: the function with() is the execution function! A simple sentence var f = function() { alert('Hi'); }; will not pop up, and the following sentence f(); will execute the code inside the function. The above code is translated as:
var result = new Array(), i;result[0] = function(){ return i; }; //The function is not executed, the function remains unchanged, and the i in the function cannot be replaced! result[1] = function(){ return i; }; //The function is not executed, the function remains unchanged, and the i in the function cannot be replaced! ...result[9] = function(){ return i; }; //The function is not executed, the function remains unchanged, and the i in the function cannot be replaced! i = 10;funcs = result;result = null;console.log(i); // funcs[0]() is to execute the return i statement, which is to return 10console.log(i); // funcs[1]() is to execute the return i statement, which is to return 10...console.log(i); // funcs[9]() is to execute the return i statement, which is to return 10Why only garbage collection results but not i? Because i is still being referenced by function. It’s like a restaurant where plates are always limited, so the waiter will go to patrol Taiwan to recycle empty plates, but how dare he collect the plates that still contain vegetables? Of course, if you manually pour out the dishes (=null) in the plate yourself, the plate will be taken away. This is the so-called memory recycling mechanism.
As for how the value of i can still be retained, in fact, reading it all the way from the beginning of the article should not be anything to worry about. Isn’t it necessary to eat one piece of the dish on the plate to lose one piece?
Let's summarize
A closure is a variable that a function refers to another function. Because the variable is referenced, it will not be recycled, so it can be used to encapsulate a private variable. This is an advantage and a disadvantage. Unnecessary closures will only increase memory consumption! In addition, when using closures, you should also pay attention to whether the value of the variable meets your requirements, because it is like a static private variable. Closures are usually mixed with many things, and only after contacting them with more understanding can we deepen our understanding. Here we are just talking about basic things.
Link to this article: http://www.cnblogs.com/qieguo/p/5457040.html
The above is all about this article, I hope it will be helpful to everyone's learning.