premises
Through the recent learning of JavaScript video, a new function-anonymous function-is also exposed to a new noun--closure--by learning something fresh. Let's start with the basic anonymous function. One, anonymous function
Anonymous functions are functions that have no names, and closures are functions that access variables in the scope of a function .
A small demo compares the difference between a common function and an anonymous function:
normal function
box () {return
' Lee ';
}
Alert (Box ());
Anonymous functions
function () {return
' Lee ';
}
Alert (Box ()); There is a compile error at this time, unexpected token
There are two ways to write about anonymous functions
Self-executing by expression
(function () {return
' Lee ';
}) ();
Assign the anonymous function to the variable
var box=function () {return
' Lee ';
};
second, what is closure (definition)
Closures are functions that have access to variables in the scope of another function, and the common way to create closures is to create another function inside one function and access the function's local variables through another function.
<span style= "FONT-SIZE:18PX;" >//the anonymous function inside the ordinary function, resulting in the closure function
box () {return
function () {return
' Lee ';
}
}
Alert (Box () ());//Call anonymous function </span>
The problem with this closure is that local variables can be accessed to the function. third, closure of the application 1, imitate block-level scope (private scope)
<span style= "FONT-SIZE:24PX;" ></SPAN>//mimics block-level scopes (private scope)
(function () {
//is a block-level scope
}) ();
Rewrite
the function box (count) {
<span style= "White-space:pre" > </span> (function) with a block-level scope (private scope) ( {
<span style= "White-space:pre" > </span>for (var i = 0; i<count; i++) {}
<span style= " White-space:pre "> </span>}" ();
<span style= "White-space:pre" > </span>alert (i);//error, inaccessible
}
box (2);
There are two very distinct features that will not be destroyed in addition to the scope, and declaring a variable will not change its value. The biggest advantage is that any variable defined in the anonymous function is destroyed at the end of execution, often used outside of the function used in the global scope, restricting the addition of too many variables and functions to the global scope, and avoiding naming conflicts caused by multiple development. Also, using block-level scopes in global scopes can reduce the memory footprint of closures.
2. Static private Variables
By defining a private variable or function in a block-level scope, you can also create an external public privileged method.
(function () {
var age =;
function run () {return
' run ... ';
}
Box = function () {}; Construct method
Box.prototype.go = function () {//prototype method return age
+ run ();}
;}
) ();
var box = new box ();
Alert (Box.go ());
Using prototype causes methods to be shared, and age becomes a static property. (The so-called static property, that is, the total
Enjoy the properties in different objects).
3, module mode
All of the previous uses were constructors to create private variables and privileged methods. Then the object literal method is collected
Use module mode to create.
var box = {//literal object, also a single instance object <span style= "White-space:pre" > </span>age:100,//This is a public property that will be converted to private <span style= "white -space:pre "> </span>run:function () {//At this point the public function will be changed to private <span style=" White-space:pre "> </span>
Return ' run ... ';
<span style= "White-space:pre" > </span>};
}; Privatization variables and functions: var box = function () {var age = <span style= "White-space:pre" > </span>function run () {<
Span style= "White-space:pre" > </span>return ' Run ... '; <span style= "White-space:pre" > </span> <span style= "White-space:pre" > </span>return {// Direct return object <span style= "White-space:pre" > </span>go:function () {<span style= "White-space:pre" > </s
Pan>return Age + Run ();
<span style= "White-space:pre" > </span>} <span style= "White-space:pre" > </span>}; }();
The nature of the module pattern: By returning an object or variable and assigning it to a function external variable, we can expose anything that we want to expose to the outside world, and we can have open and private methods. Iv. Advantages and disadvantages of closures Advantages
Is that local variables can reside in memory, and you can avoid using global variables. (global variable pollution causes application unpredictability, each module can call will lead to disaster, so it is recommended to use private, encapsulated local variables). It is the use of local variables can also be exposed to any hope of exposure to the outside.
Disadvantage
1, because the scope returned by the closure of the local variable resources will not be destroyed immediately recycle, so may occupy more memory. Excessive use of closures can lead to performance degradation, and it is recommended that closures be used when necessary.
2, the mechanism of the scope chain causes a problem, in the loop of the anonymous function to obtain any variable is the last value.
3. Using this object in closures can also cause problems, this object is bound at run time based on the execution environment of a function, if this is window in the global scope, and if this object is pointed inside the object. The closure, however, points to window at runtime because the closure does not belong to the object's properties or methods.
4, memory leaks, because IE's JScript objects and DOM objects using different garbage collection methods, so closures in IE will cause
Some problems. Is the problem of memory leaks, which means that the elements that reside in memory cannot be destroyed. v. Summary
Learning about JavaScript is just beginning, the closure of the study or some of the basic content, and then grasp the basis of the module on the closure of the model is still very worthwhile to study, of course, the small part of the study, the ability or poor, for the module mode parts of the content, after learning will be shared. There are some solutions to the problems in the closure, then the next article is discussed.
PS: Feel now learning content only listen to the teacher's teaching or is far from enough, we need to patiently query some information, enrich some of their horizons, and some practical examples of operation, the feeling will be better.
Little White has just begun to learn, if there is an understanding of the bias, please do not hesitate to enlighten the great God, thank you.