Detailed explanation of JS closure concept

Closure understanding

1.   How to generate closures?

   * When a nested internal ( child ) function references a variable ( function ) of a nested external ( parent ) function , a closure

2.   What is a closure?

   * Use Chrome debugging to view

   * Understanding 1: Closures are nested internal functions ( most people )

   * Understanding II: contains the referenced variable ( function ) objects ( a handful of people )

   * Note: Closures exist in nested internal functions

3. What   are the conditions for the closure?

   * Function nesting

   * Internal functions refer to data of external functions ( variables / functions )

   * Execution function definition ( such as when executing an external function )

(Execution function definition will have closure, without calling the internal function, will yield when calling an external function pretreated raw execution context, then you can perform a function defined inside)

This type of function definition already generates a closure on line 22.

 

If the function definition is assigned to a variable, a closure cannot be generated at line 22, because fn2 will be promoted as a variable during preprocessing, the value is undefined, and no function definition is executed. There is no closure.

The function object declared in this way will not generate a closure until the entire function definition on line 26 is executed.

 

Common closures

1. Use the function as the return value of another function

2. Pass the function as an argument to another function call

 

See how many times the internal function is created and how many times the external function is executed.

 

During the repeated execution of internal functions, why didn't the closure disappear?

 If there is no closure, a will disappear after executing var f = fn1 () , and the following f () cannot transfer a from fn1 .

 

Msg in closure , no time

 

The role of closures

1. variables inside a function of the function is completed, still alive in the memory ( extended local variable raw life cycle )

2. Make data ( variables / functions ) that can be manipulated ( read and written ) outside the function into the function

 

problem:

1. After the function is executed, does the local variable declared inside the function still exist?

Generally does not exist, the variables that exist in the closure may exist.

( "Possible" means: the function object where the closure is located does not become a garbage object )

 

It stands to reason, the function is completed inside the properties will be released, but if the function is an internal function of the object through the external function in the return way assigned to a global variable,

Then this function object is kept alive, while the local variable and its associated closure bag will survive.

 

2. Can the local variables inside the function be directly accessed outside the function?

Can't. But we can let it operate externally through closures.

( "To make an external operation by closure" means: an internal function nested function, inside this function to write a similar object in a ++ Such modifications can be a function of the operation of the internal variable,

Then assign this internal function object to the external global variable, you can manipulate the local variable inside the function externally)

 

The life cycle of closures

1. Generation: It occurs when the nested internal function definition is executed (not in the call)

2. Death: when the nested internal function becomes a garbage object

 

Closure death (function objects containing closures become garbage objects)

f = null

 

Closure Application _ custom JS module

* Js files with specific functions

* Encapsulate all data and functions inside a function (private)

* Only expose an object or method containing n methods

* Users of the module only need to call methods through the objects exposed by the module to achieve the corresponding functions

The first

 

 

 

The second

 

 This can be called directly, which is more convenient than the first one.

 

In addition, the details when compressing the code, the parentheses at the top and bottom are written as window .

You can compress all windows to w .

 

The disadvantages and solutions of closures

1. Disadvantages

* After the function is executed, the local variables in the function are not released, and the memory time will become longer

* Easy to cause memory leak

2. Solve

* Can be used without closures

* Timely release

f = null // Let internal functions become garbage objects- > recover closures

 

Memory overflow and memory leak

1. Memory overflow

* An error that occurs when a program is run

* When the memory required by the program to run exceeds the remaining memory, a memory overflow error is thrown

2. Memory leak

* The occupied memory is not released in time

* Excessive accumulation of memory leaks leads to memory overflow

* Commonly used memory leaks:

 * Unexpected global variable (variable defined without var in function )

 * Timers or callback functions that are not cleaned up in time (do not clean up after starting the loop timer)

 * Closures (without active f = null to make embedded function objects garbage objects, closures will always exist)

Guess you like

Origin www.cnblogs.com/fzgt/p/12761499.html
Recommended