Anonymous functions in JavaScript organize your notes

Source: Internet
Author: User
Tags java anonymous class

The following is a summary
In the open source JavaScript framework, you can see a lot of these grammatical constructs
(function () {
}
)()
Like the jquery I saw recently, and the Chediter. At first I saw this kind of result is a bit strange, how it is executed, and this is what kind of grammatical structure, recently occasionally look at the closure of the time, only to find that this is the JavaScript kind of anonymous function (see this a little sweat, Java Anonymous class has seen, It never occurred to me that there would be anonymous functions in JavaScript, and that learning was not strong enough.
Now we understand that the above is the syntax structure of the JavaScript anonymous function, how to declare the function, how anonymous function JavaScript is executed, the code pattern of the anonymous function. These problems

Is the question we are going to explore next.
First: How to declare a function.
Method one function functionname (arguments) {body}
In JavaScript functions a typical function, also known as a function (because it exists functionname).
function Fun () {alert ("test")}//1
Fun ();//2
Line 1th This is the most common way for JavaScript to declare known functions, and is the most common way of declaring our personal development.
The syntax structure is to declare a function called fun (note that JavaScript compiles only the function and generates the object of the fun function, which does not execute the function).
The second sentence executes the function when it is called.
Method two var fun = function (arguments) {body}//also called functional literal
var fun = function () {alert ("Test")}
The function is copied to the variable fun, in fact, the following function is an anonymous function
Method three Var fun=new Function ([arguments], Body);
Copy a function to a variable fun
Note that there is a performance problem with this approach, which is not statically compiled and executed when the new function method is executed, but is dynamically compiled and executed, that is, the function body is compiled when the new function is executed, and the function object is generated, and the process of compiling and executing each call is "similar to the function eval () ", which is more than the other side of the compilation process" will use the browser's compiler

", if the performance of the recirculation body is relatively low, the above three definitions of function, the latter two ways of using anonymous functions of what variables.
The second: How anonymous functions are performed.
For the syntax structure

    1. (function () {
    2. Alert ( "test");
    3. }
    4. )()

It's actually made up of two parts.
(function () {
Alert ("Test");
}
) represents the definition of an anonymous function.
And for the Next "()" represents the anonymous function that defines the execution.
The above syntax structure is also equivalent to the following syntax structure

    1. var test=function () {
    2. Alert ( "test");
    3. function contents
    4. };  //Declare an anonymous class and assign an anonymous function to the variable test.
    5. Test (); //Execute test

It can be seen that anonymous classes can be executed directly behind the class (), which is why we can use objects directly when we import the corresponding packages in the open source framework of jquery. It has completed the corresponding initialization and encapsulation in the anonymous function.
Knowing how anonymous classes are executed, what are the anonymous functions we use?
Third: Code patterns for anonymous function tuning
Hedger Wang introduces the code patterns for several anonymous functions:
Error mode: It does not work, the browser will report syntax error.

    1. function () {
    2. Alert (1);
    3. }();

The reason for the above error is that () you can change the priority of the expression, using () will first execute () the code inside, and for the expression () for JavaScript compilation does not pass.
function literal: Declare a Function object first, and then execute it. Also known as an immediate execution function.

    1. (function () {
    2. Alert (1);
    3. } ) ( );

The compilation must pass, the first () is the function definition, and the second () represents the execution of the contents of the first parenthesis
Precedence expression: Because the JavaScript execution expression is from inside the parentheses to the outside, you can enforce the declared function with parentheses.

    1. ( function () {
    2. Alert (1);
    3. } ( ) );

void operator: Use the void operator to execute a single operand that is not enclosed in parentheses.

    1. void function () {
    2. Alert (1);
    3. }()

These three ways are equivalent, Hedger Wang for personal reasons prefer the 3rd kind, and in practical application I see and use is the 1th and the above mentioned new Funtion () definition way.

With the help of the VAR keyword, anonymous functions effectively ensure that JavaScript is written on the page without polluting the global variables. can also increase the code read and write lines, reduce the amount of code, improve the performance of the program.

Anonymous functions in JavaScript organize your notes

Related Article

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.