Look at this piece of http://www.ruanyifeng.com/blog/2009/08/learning_javascript_closures.html
The definition of "closure" (closure) in various professional literature is very abstract and difficult to read. My understanding is that closures are functions that can read other functions ' internal variables.
This article: http://www.cnblogs.com/rainman/archive/2009/05/04/1448899.html
4, Attention4.1a closure allows an inner-layer function to refer to a variable in the parent function, but the variable is the final value example six:/*** <body> * <ul> * <li>one</li> * <li>two</li> * <li>three</l i> * <li>one</li> * </ul>*/var lists= document.getElementsByTagName (' li '); for(var i = 0, len = lists.length; i < Len; i++) {lists[i].onmouseover=function () {alert (i); };} You will find that when the mouse moves over each of the<li&RT; element, always pops up 4 instead of the element subscript we expect. What is this for? The notice has been said (final value). Obviously this explanation is too simple, when the MouseOver event invokes the listener function, first in the anonymous function (function () {alert (i);} If the internal lookup defines I, the result is undefined; so it looks up, the results are already defined, and the value of I is 4 (the I value after the loop), so the final pop-up is 4. Workaround one: var lists= document.getElementsByTagName (' li '); for(var i = 0, len = lists.length; i < Len; i++) {(function (index) {lists[index].onmouseover=function () {alert (index); }; }) (i);} Solution Two: var lists= document.getElementsByTagName (' li '); for(var i = 0, len = lists.length; i < Len; i++) {lists[i].$ $index= i;//record subscript by binding the $ $index attribute on the DOM elementlists[I].onmouseover =function () {alert ( This. $ $index); };} Workaround Three: function EventListener (list, index) {list.onmouseover=function () {alert (index); };} var lists= document.getElementsByTagName (' li '); for(var i = 0, len = lists.length; i < Len; i++) {EventListener (lists[i], i);}
Closures can also cause memory leaks: http://www.cnblogs.com/rainman/archive/2009/03/07/1405624.html
If the above example (4th) in obj refers to a JavaScript function object (inner), instead of an ActiveX object or DOM element, then the circular reference formed in IE cannot be freed. function init () { = document.getElementById (' id ' ); = function () { alert (' Rain-man '); // the Elem element is referenced here };} Elem references its listener function for the Click event, and the function also references the Elem element through its scope chain. This will not release these circular references in IE even if you leave the current page.
JavaScript Learning-Closures