Home > Developer > JavaScript
Function class
Definition
The Function class can represent any Function defined by the developer. The syntax for directly creating a Function using the Function class is as follows:
Var function_name = new Function (agrument1, agrument2,..., argumentN, function_body );
Each argument is a parameter, and the last parameter is the function body (the code to be executed ).
Example:
Copy codeThe Code is as follows:
Function sayHi (sName, sMessage ){
Alert ("Hello" + sName + "," + sMessage );
}
You can also define it as follows:
Var sayHi = new Function ("sName", "sMessage", "alert (\" Hello \ "+ sName + \", \ "+ sMessage );");
Note: Although Function constructor can be used to create a Function, it is better not to use it because defining a Function with it is much slower than using the traditional method. However, all functions should be considered as Function class instances.
Attributes and Methods
Because functions are reference types, they also have attributes and methods. The length attribute defined by ECMAScript declares the expected number of parameters of the function. For example:
Copy codeThe Code is as follows:
Function doAdd (iNum ){
Alert (iNum + 10 );
}
Function sayHi (){
Alert ("Hi ");
}
Alert (doAdd. length); // outpus 1
Alert (sayHi. length); // outpus 0
Function objects also have standard valueOf () and toString () Methods shared with all objects. These two methods return the source code of the Function, which is particularly useful during debugging.
For example:
Copy codeThe Code is as follows:
Function doAdd (iNum ){
Alert (iNum + 10 );
}
Alert (doAdd. toString ());
This code outputs the text of the doAdd () function.
Closure
Definition
A closure is a function that indicates lexical representation of variables that do not need to be computed. That is to say, a function can use variables defined outside the function. Using global variables in ECMAScript is a simple closure instance.
Example:
Copy codeThe Code is as follows:
Var sMessage = "Hello World ";
Function sayHelloWold (){
Alert (sMessage );
}
SayHelloWorld ();
Defining another function in a function makes the closure more complex, for example:
Copy codeThe Code is as follows:
Var iBaseNum = 10;
Function addNumbers (iNum1, iNum2 ){
Function doAddtion (){
Return iNum1 + iNum2 + iBaseNum;
}
Return doAddtion ();
}
Here the addNumbers () function includes the doAddtion () (closure) function ). An internal function is a closure because it gets the values of the parameters iNum1 and iNum2 of the external function and the global variable iBaseNum. The last step of addNumbers () is to call the internal function, add two parameters and global variables, and return their sum. The important concept to be mastered here is that the doAddtion () function does not accept the parameter at all, and it is obtained from the execution environment.
As you can see, closures are a very powerful and versatile part of ECMAScript and can be used for complex computing. Just like using any advanced function, be careful when using closures because they may become very complex.
Sample Code
Copy codeThe Code is as follows:
<! DOCTYPE html>
<Html>
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8"/>
<Title> JavaScript advanced programming: Function class and closure </title>
<Script type = "text/javascript">
Function doAdd (iNum ){
Alert (iNum + 10 );
}
Function sayHi (){
Alert ("Hi ");
}
Function lengthProperty (){
Alert (doAdd. length );
Alert (sayHi. length );
}
Function valueOfMethod (){
Alert (doAdd. valueOf ());
}
Function toStringMethod (){
Alert (doAdd. toString ());
}
Var sMessage = "Hello World ";
Function sayHelloWorld (){
Alert (sMessage );
}
Function demoOne (){
SayHelloWorld ();
}
Var iBaseNum = 10;
Function addNumbers (iNum1, iNum2 ){
Function doAddtion (){
Return iNum1 + iNum2 + iBaseNum;
}
Return doAddtion ();
}
Function demoTwo (){
Alert (addNumbers (1, 2 ));
}
</Script>
</Head>
<Body>
<H1> Length: <Input type = "button" onclick = "lengthProperty ()" value = "LengthProperty"/>
<H1> valueOf ()/toString (): <Input type = "button" onclick = "valueOfMethod ()" value = "ValueOfMethod"/>
<Input type = "button" onclick = "toStringMethod ()" value = "ToStringMethod"/>
<H1> closure: <Input type = "button" onclick = "demoOne ()" value = "Demo One"/>
<Input type = "button" onclick = "demoTwo ()" value = "Demo Two"/>
</Body>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
