Shulou(Shulou.com)06/03 Report--

This article will explain in detail what the closure of javascript means. The editor thinks it is very practical, so I share it for you as a reference. I hope you can get something after reading this article.

In javascript, when two functions are nested within each other, the internal function is the closure. Closures are functions that have access to variables in the scope of another function. The most common way to create closures is to create another function within one function and access local variables of that function through another function.

The operating environment of this tutorial: windows7 system, javascript1.8.5 version, Dell G3 computer.

What is a closure?

A closure is a function that can read variables inside other functions. In javascript, only subfunctions inside a function can read local variables, so closures can be understood as "functions defined inside a function". In essence, a closure is a bridge that connects the interior of a function to the outside of a function. The most typical use of closures is to implement callback functions (callback).

2. Advantages, disadvantages and characteristics of closures in JS.

Advantages:

     1. Protect the variables in the function

     2. Keep a variable in memory (using too much becomes a disadvantage, taking up memory)

     3, logical continuity, when the closure as another function call parameter, to prevent you from the current logic and write additional logic separately.

     4. Local variables that facilitate invocation context.

     5. By strengthening the encapsulation, the variable can be protected.

Disadvantages:

     1, resident memory, will increase memory usage, improper use is easy to cause memory leakage.

     2. There is also a very serious problem, that is, memory waste, which is not only because it resides in memory, but more importantly, improper use of closures will result in invalid memory.

Properties:

     1, function nesting function

     2. Internal functions can access variables of external functions.

     3, parameters, and variables are not recycled.

Third, variable scope

To understand closures, it is not possible to understand only the concepts of closures above. The first step is to understand the special variable scope of javascript.

1. There are only two kinds of scope of variables: global variables and local variables.

2. The special feature of javascript language is that the global variables can be read directly inside the function, but the local variables can not be read outside the function.

3. Note: when declaring variables inside the function, be sure to use the var command. If not, you are actually declaring a global variable!

Fourth, interpreting closures with code

The process of creating closures for    in Javascript, as shown in the following procedure.

Function a () {var I = 0; function b () {alert (iTunes +);} return b;} var c = a (); c (); / / function call

Code characteristics

This code has two characteristics:

  1 and function b are nested inside function a

  2, function a returns function b.

So after executing var c = a (), the variable c actually points to the function b, and then executing c () will pop up a window showing the value of I (1 for the first time). This code actually creates a closure because the variable c outside function a refers to function b within function a. That is, when the internal function b of function an is referenced by a variable outside function a, a closure is created.

Action

In short, the function of closures is that after an is executed and returned, the closure ensures that Javascript's garbage collection mechanism will not recover the resources occupied by a, because the execution of a's internal function b depends on the variables in a.

In the above example, due to the existence of the closure, the I in an always exists after the function a returns, so that every time c () is executed, I is the value of alert I since the addition of 1.

So let's imagine another situation, if a doesn't return function b, the situation is completely different. Because after the execution of a, b is not returned to the outside world of a, but is referenced by a, and at this time a will only be referenced by b, so the functions an and b refer to each other but are not disturbed by the outside world (referenced by the outside world), the functions an and b will be recycled.

Application scenario

1. Protect the variables in the function. In function a, I can only be accessed by function b and cannot be accessed by other means, so the security of I is protected.

2. Maintain a variable in memory. Because of the closure, the I in function an always exists in memory, so every time c () is executed, I will be incremented by 1.

Fifth, how to read the local variables inside the function from the outside?

   for a variety of reasons, we sometimes need to get local variables inside the function. However, as mentioned above (III, variable scope), under normal circumstances, this is impossible! It can only be achieved through flexible methods. That is to define another function inside the function.

Function demo1 () {var n = 6699; function demo2 () {alert (n); / / 6699}}

In the above code, the function demo2 is included in the function demo1, and all local variables inside the demo1 are visible to demo2. But not the other way around. Local variables inside demo2 are not visible to demo1.

This is the "chained scope" structure (chain scope) peculiar to the Javascript language, where child objects look up all the variables of the parent object level by level. Therefore, all variables of the parent object are visible to the child object, and vice versa.

Since demo2 can read local variables in demo1, as long as we take demo2 as the return value, we can read its internal variables outside of demo1!

VI. The use of closures

Closures can be used in many places. It has two greatest uses, one is to read variables within the function mentioned earlier, and the other is to keep the values of these variables in memory all the time and not be automatically cleared after the demo1 call.

Then why is this happening? The reason is that demo1 is the parent of demo2, and demo2 is assigned to a global variable, which causes demo2 to always be in memory, while the existence of demo2 depends on demo1, so demo1 is always in memory and will not be reclaimed by the garbage collection mechanism (garbage collection) after the call ends.

Pay attention to the use of closures

1. Since closures make all variables in the function stored in memory and consume a lot of memory, closures should not be abused, otherwise it will cause performance problems of web pages and may lead to memory leaks in IE. The solution is to delete all unused local variables before exiting the function.

2. The closure changes the value of the internal variable of the parent function outside the parent function. So, if you use the parent function as an object (object), the closure as its common method (Public Method), and the internal variable as its private property (private value), you must be careful not to change the value of the internal variable of the parent function.

VIII. Summary:

1. A closure is a function that has access to variables in the scope of another function. The most common way to create a closure is to create another function within a function and access the function's local variables through another function. The disadvantage of closures is that they are resident in memory, which will increase memory usage, and improper use can easily lead to memory leaks.

2. Not suitable for the scenario: the function that returns the closure is a very large function.

The typical framework for      closures should be jquery.

     closure is a major feature of javascript language. The main application of closure is to design private methods and variables.

     this is more obvious when making the framework, some methods and properties are only used in the operation logic process, do not want to modify these properties externally, so you can design a closure to provide only method acquisition.

3. You don't have to worry about what a closure is. In fact, every function you write is a closure, even if it is a global function. When you access a global variable outside the function, it is a closure.

The embodiment of.

This is the end of the article on "what the closure of javascript means". I hope the above content can be helpful to you, so that you can learn more knowledge. if you think the article is good, please share it out for more people to see.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.