Js closure and closure range

First, let's explain what a closure is. An internal function is used to make its visible range out of its defined range, which generates a closure within its defined range. let's take a look at how innerfunction javascript supports innerfunct... syntaxHighlighter. all (

First, let's explain what a closure is.

A closure is an internal function that allows its visible range to exceed its defined range in some way, which generates a closure within its defined range.
Let's take a look at the inner function)
Javascript is a programming language that supports inner function declaration,

An internal function is defined within another function, such
Function outerFun (){
Function innerFun (){
Alert ('hello ');
}
}

The innerFun function is an internal function, which is visible within the function outerFun range,
That is to say, the namespace of the innerFun function is within the outerFun range.

Correct call
Function outerFun (){
Function innerFun (){
Alert ('hello ');
}
InnerFun ();
}
OuterFun (); alerts hello
Error)
Function outerFun (){
Function innerFun (){
Alert ('hello ');
}
}
InnerFun ();

So what should I do if I want to call the innerFun function outside function outerFun?
Practice 1
Var globVar;
Function outerFun (){
Function innerFun (){
Alert ('hello ');
}
GlobVar = innerFun;
}
OuterFun ();
GlobVar ();
Practice 2
Function outerFun (){
Function innerFun (){
Alert ('hello ');
}
Return innerFun;
}
Var globVar = outerFun ();
GlobVar ();

Practice 3
Function outerFun (){
Function innerFun (){
Alert ('hello ');
}
Return {'nerfun' innerFun };
}
Var globVar = outerFun ();
GlobVar. innerFun ();

The preceding three methods expand the visible range of internal functions. The last method is to regard internal functions as attributes of the anonymous object {'innerfun' innerFun} and return them together.

In javascript, the function name can be considered as a reference variable, similar to the pointer concept in c. Here, with the execution of the program
Two reference variables will be generated pointing to the internal function innerFun. One is globVar (the third approach is globVar. innerFun), and the other is its own innerFun function,
However, the visible ranges of the two variables are different, that is, the namespaces are different.
The javascript Garbage Collector releases the memory occupied by the function after the last referenced variable is discarded.

Measure the test taker's knowledge about the variable range.
Example 1 internal function variable
The visible range of variables declared in the internal function is within the function.
Function outerFun (){
Function innerFun (){
Var innerVar = 0;
InnerVar ++;
Alert (innerVar );
}
Return innerFun;
}
Var globVar = outerFun ();
GlobVar (); Alerts 1
GlobVar (); Alerts 1
Var innerVar2 = outerFun ();
InnerVar2 (); Alerts 1
InnerVar2 (); Alerts 1

Each internal function call, a new innerVar variable is created, so the result is 1

Example 2 internal functions reference global variables)

Var globVar = 0;
Function outerFun (){
Function innerFun (){
GlobVar ++;
Alert (globVar );
}
Return innerFun;
}
Var globVar = outerFun ();
GlobVar (); Alerts 1
GlobVar (); Alerts 2
Var globVar2 = outerFun ();
GlobVar2 (); Alerts 3
GlobVar2 (); Alerts 4
For each internal function call, the global variable is increased by 1, so the result is displayed in ascending order.

Example 3 internal functions reference external function variables
 
Function outerFun (){
Var outerVar = 0;
Function innerFun (){
OuterVar ++;
Alert (outerVar );
}
Return innerFun;
}
 
Var globVar = outerFun ();
GlobVar (); Alerts 1
GlobVar (); Alerts 2
Var globVar2 = outerFun ();
GlobVar2 (); Alerts 1
GlobVar2 (); Alerts 2
Note that a new variable outerVar is created when outerFun () is called 2nd times, so the result is 1, 2, 2.

What is closures? internal functions make the visible range out of the defined range by some means. In Example 3, globVar is a closure of the outerFun () function,
The time when the closure is generated is the code var globVar = outerFun (). Let's look at example 3. After the closure globVar is called for the first time, the value of the variable outerVar is still in the memory.
The value of the closure globVar is increased to 2 in the second call. As long as globVar is not discarded, the value of outerVar will always exist. For example, outerVar
Such a variable is called a free variable.

After reading this, let's take a look at the relationship between closures and object-oriented programming.
Take a look at the example below
Function outerFun (){
Var outerVar = 0;
Function innerFun (){
OuterVar ++;
Alert (outerVar );
}
Function innerFun2 (){
OuterVar = outerVar + 2;
Alert (globVar );
}
Return {'innerfun' innerFun, 'outerfun2' outerFun2 };
}

Var globVar = outerFun ();
GlobVar. innerFun (); Alerts 1
GlobVar. innerFun2 (); Alerts 3
GlobVar. innerFun (); Alerts 4
Var globVar2 = outerFun ();
GlobVar2.innerFun (); Alerts 1
GlobVar2.innerFun2 (); Alerts 3
GlobVar2.innerFun (); Alerts 4

OuterFun () can be viewed as a class, globVar and globVar2 can be considered as two instances, the instance variable is outerVar, and the private. Function innerFun (),
InnerFun2 () is the instance method.

This may not be very clear. Let's look at the example below.
Function Boy (){
Var name;
Function setName (vName ){
Name = vName;
}
Function getName (){
Return name;
}
Return {'setname' setName, 'getname' getName };
}
Var boy1 = Boy ();
Boy1.setName (zhuzhenhua );
Alert (boy1.getName ());

Author: zmyxmjz