Brief introduction to JavaScriptfunction function type _ basic knowledge

Source: Internet
Author: User
This article mainly introduces the types of JavaScriptfunction functions, including common functions, anonymous functions, closure functions, and comprehensive examples. we recommend them to you here and hope they can help you. This topic describes common functions, anonymous functions, and closure functions.

1. Introduction to common functions
1.1 Example

The code is as follows:


Function ShowName (name ){
Alert (name );
}

1.2 Coverage of functions with the same name in Js

In Js, functions are not overloaded. functions with the same function name and different parameter signatures are defined. the subsequent functions will overwrite the previous functions. Only the following functions are called.

The code is as follows:


Var n1 = 1;

Function add (value1 ){
Return n1 + 1;
}
Alert (add (n1); // call the following function, output: 3

Function add (value1, value2 ){
Return value1 + 2;
}
Alert (add (n1); // output: 3

1.3 arguments object

Arguments is similar to the params of C #. variable parameters: the number of parameters passed in to a function is greater than the number of parameters defined at the time of definition.

The code is as follows:


Function showNames (name ){
Alert (name); // John
For (var I = 0; I <arguments. length; I ++ ){
Alert (arguments [I]); // Zhang San, Li Si, Wang Wu
}
}
ShowNames ('Zhang San', 'Li Si', 'Wang Wu ');

1.4 default range value of the function

If the function does not specify the return value, 'undefined' is returned by default'

The code is as follows:


Function showMsg (){
}
Alert (showMsg (); // output: undefined

  

2. anonymous functions

2.1 Variable anonymous functions

2.1.1 Description
You can assign values to variables and events.

2.1.2 Example

The code is as follows:


// Variable anonymous function. variables and events can be left-side functions.
Var anonymousNormal = function (p1, p2 ){
Alert (p1 + p2 );
}
AnonymousNormal (3, 6); // output 9

2.1.3 Applicable scenarios
① Avoid function name contamination. If a function with a name is declared first and then assigned to a variable or event, the abuse of the function name is caused.

2.2 Anonymous functions without names

2.2.1 Description
That is, when the function is declared, the parameter is followed. When the Js syntax parses this function, the code in it is executed immediately.

2.2.2 Example

The code is as follows:


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

2.2.3 applicable scenarios
① Only one execution is required. If the browser load is complete, you only need to execute the function once and will not execute it later.

3. closure functions

3.1 Description

Assume that function A declares function B internally. function B references A variable other than function B, and the return value of function A is A reference of function B. Then function B is the closure function.

3.2 Example

3.2.1 Example 1: Global reference and local reference

The code is as follows:


Function funA (){
Var I = 0;
Function funB () {// closure function funB
I ++;
Alert (I)
}
Return funB;
}
Var allShowA = funA (); // global variable reference: accumulative output of 1, 2, 4, and so on

Function partShowA (){
Var showa = funA (); // local variable reference: only output 1
Showa ();
}

AllShowA is a global variable that references the function funA. If you run allShowA () repeatedly, the accumulated values, such as 1, 2, 4, and so on, are output.

Execute the partShowA () function because only the local variable showa is declared internally to reference funA. after the execution is complete, the resources occupied by showa are released due to the scope.

The key to closure is scope: the resources occupied by global variables are released only when the page is changed or the browser is closed. Var allShowA = funA () is equivalent to allShowA referencing funB (), so that the resources in funB () are not recycled by GC, so the resources in funA () are not.

3.2.2 Example 2: a closure function with parameters

The code is as follows:


Function funA (arg1, arg2 ){
Var I = 0;
Function funB (step ){
I = I + step;
Alert (I)
}
Return funB;
}
Var allShowA = funA (2, 3); // call funA arg1 = 2, arg2 = 3
AllShowA (1); // call funB step = 1, and output 1
AllShowA (3); // call funB setp = 3, and output 4

3.2.3 Example 3: share variables in the parent function funA

The code is as follows:


Function funA (){
Var I = 0;
Function funB (){
I ++;
Alert (I)
}
AllShowC = function () {// allShowC references the anonymous function and shares the variable I with funB.
I ++;
Alert (I)
}
Return funB;
}
Var allShowA = funA ();
Var allShowB = funA (); // allShowB references funA, allShowC re-binds internally, and shares the variable I with allShowB

3.3 applicable scenarios

① Ensure the security of the variables in the function funA, because the variables in funA cannot be directly accessed from outside.

Do you know something about javascript function functions? if you have any questions, leave me a message.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.