On the types of JavaScript function functions _ Basic knowledge

This article mainly introduces the ordinary function, the anonymous function, the closure function

1. General function Introduction
1.1 Example

Copy Code code as follows:

function ShowName (name) {
alert (name);
}

Overlay of functions with the same name in 1.2 JS

In JS, the function is not overloaded, the same function name, the signature of the different parameters of the function, the following function will overwrite the previous function. When invoked, only the following functions are called.

Copy Code code as follows:

var n1 = 1;

function Add (value1) {
return n1 + 1;
}
Alert (Add (N1));//called the following function, output: 3

function Add (value1, value2) {
return value1 + 2;
}
Alert (Add (N1));//output: 3

1.3 Arguments Object

Arguments similar to C # 's params, manipulating variable parameters: The number of arguments passed in a function is greater than the number of parameters defined.

Copy Code code as follows:

function ShowNames (name) {
alert (name);//John
for (var i = 0; i < arguments.length; i++) {
Alert (arguments[i]);//John, Dick, Harry
}
}
ShowNames (' John ', ' Dick ', ' Harry ');

The default range value of the 1.4 function

If the function does not indicate the return value, the default return is ' undefined '

Copy Code code as follows:

function ShowMsg () {
}
Alert (ShowMsg ());//output: undefined

　　

2. anonymous function

2.1 Variable anonymous function

2.1.1 Description
You can assign a function to a variable, an event.

2.1.2 Sample

Copy Code code as follows:

Variable anonymous function, left can be variable, event, etc.
var anonymousnormal = function (P1, p2) {
alert (P1+P2);
}
Anonymousnormal (3,6);//Output 9

2.1.3 Applicable scene
① avoid the pollution of the function name. If you declare a function with a name, and then assign a value to a variable or event, it causes the misuse of the function name.

2.2 Anonymous function without name

2.2.1 Description
That is, when the function declaration is followed by the argument. When the JS syntax resolves this function, the inside code executes immediately.

2.2.2 Sample

Copy Code code as follows:

(function (p1) {
Alert (p1);
}) (1);

2.2.3 Applicable scene
① only need to be executed once. If the browser finishes loading, just perform the function once and not performed.

3. Closure function

3.1 Description

Suppose, function a declares a function B, function b references a variable other than function B, and the return value of function A is a reference to function B. Then function B is the closure function.

3.2 Example

3.2.1 Example 1: Global References and local references

Copy Code code as follows:

function Funa () {
var i = 0;
function Funb () {//Closure functions Funb
i++;
Alert (i)
}
return FUNB;
}
var Allshowa = Funa (); Global variable reference: Cumulative output 1,2,3,4, etc.

function Partshowa () {
var Showa = Funa ();//local variable reference: output only 1
Showa ();
}

Allshowa is a global variable that references the function Funa. Running the Allshowa () repeatedly will output the cumulative value of 1,2,3,4.

Executes the function Partshowa (), because only local variable Showa is declared internally to refer to Funa, and after completion, the resources occupied by the Showa are released due to the scope relationship.

The key to closures is scope: the resources that a global variable occupies will only be released when the page transformation or browser is closed. When var Allshowa = Funa (), the equivalent of Allshowa references Funb () so that the resources in FUNB () are not reclaimed by GC, and therefore the resources in Funa () are not.

3.2.2 Example 2: A parameter closure function

Copy Code code as follows:

function Funa (ARG1,ARG2) {
var i = 0;
function Funb (step) {
i = i + step;
Alert (i)
}
return FUNB;
}
var Allshowa = Funa (2, 3); It's called Funa arg1=2,arg2=3.
Allshowa (1);//Call is Funb step=1, Output 1
Allshowa (3);//Call is Funb setp=3, output 4

3.2.3 Example 3: variable sharing within the parent function Funa

Copy Code code as follows:

function Funa () {
var i = 0;
function Funb () {
i++;
Alert (i)
}
ALLSHOWC = function () {//ALLSHOWC refers to anonymous functions, and FUNB share variable i
i++;
Alert (i)
}
return FUNB;
}
var Allshowa = Funa ();
var allshowb = Funa ();//allshowb references FUNA,ALLSHOWC is internally rebind, and ALLSHOWB shares variable i

3.3 Applicable Scenarios

① guarantees that the variables inside the function Funa are safe because the external cannot directly access the Funa variables.

Do you have any idea about the function functions of JavaScript, and leave a message for me if you have any questions?