Anonymous functions in Javascript, direct function quantity and Closure

Source: http://www.dnew.cn/post/196.htm

Let's take a look at the following methods:

1. function f (x) {return x * X;}; F (x );

2. (function (x) {return x * X;}) (X );

3. (function (x) {return x * X;} (x ));

First, we should be familiar with it. This is a frequently used method. The second and third are anonymous functions.

--------------------------------------------------------------------------------

Second
It can be understood as follows:

VaR F = function (x) {return x * X;}; F ()

Then, if we do not use the f variable to reference the function

Function (){}()

However, this is definitely wrong, just like

VaR F = 1 + 2;
F = f * 0;

And

VaR F = 1 + 2*0;

The results are the same.
To get the correct result, you can only:

F = (1 + 2) * 0;

That is, to clearly identifyProgramBlock, that is:

(Function (){})()

Are you sure you have any questions: Is the brackets "()" identified?CodeWhat is the role of a block?
We can use the built-in functions of JavaScript to check it out!
The simplest example is as follows:

Alert (4)

This code will prompt "4"
Change to this
(Alert) (4)

The execution result is the same as that of the previous code.

This form of function execution is also used by many JavaScript frameworks.

--------------------------------------------------------------------------------

Third, if you have used the jsvm framework, you will find that the code in it uses this form.
So how can we explain the third situation?
To understand how the browser understands this method, we can use the error console function of Mozilla Firefox.
Insert an error code in the Code. The code snippet is as follows:

(Function (s) {S + S} (1). splice ();

Open the Mozilla Firefox error console and you will see the following error messages:

Error: (function (s) {}) (1) has no properties
Source File: file: // C:/documents ....... Html
Row: 18

It can be considered that the browser
(Function (s) {S + S} (1 ))
Such Code follows

(Function (s) {S + S}) (1)
.

--------------------------------------------------------------------------------

You may have the following knowledge:

Function f (x) {return x * X;}; F (x) ;== (function (x) {return x * x ;}) (X ); ==( function (x) {return x * X;} (x ));

But they are different,
First, for the second and third forms, it is impossible for other functions and code to call the defined function. There is a saying that such a function is called an anonymous function or a function directly.
Second, for functions executed in the second and third forms, the intermediate variables do not pollute the global namespace. You can regard the intermediate code as a pure sub-process call.
Of course, using the following two forms of function definition can easily implement closures.
Let's look at an example:

/*
Http://jibbering.com/faq/faq_notes/closures.html (dnew. cn note)
A global variable-getimginpositioneddivhtml-is declared and
Assigned the value of an inner function expression returned from
A one-time call to an outer function expression.

That inner function returns a string of HTML that represents
Absolutely positioned Div wrapped round an IMG element, such that
All of the variable attribute values are provided as parameters
To the function call :-
*/
VaR getimginpositioneddivhtml = (function (){
/* The-buffar-array is assigned to a local variable of
Outer function expression. It is only created once and that one
Instance of the array is available to the inner function so that
It can be used on each execution of that inner function.

Empty strings are used as placeholders for the date that is
Be inserted into the array by the inner function :-
*/
VaR buffar = [
'<Div id = "',
'', // Index 1, div ID attribute
'"Style =" position: absolute; top :',
'', // Index 3, div top position
'Px; left :',
'', // Index 5, div left position
'Px; width :',
'', // Index 7, div width
'Px; Height :',
'', // Index 9, div height
'Px; overflow: hidden; \ "> '', // Index 11, IMG URL
'\ "Width = \"',
'', // Index 13, IMG width
'\ "Height = \"',
'', // Index 15, IMG height
'\ "Alt = \"',
'', // Index 17, IMG alt text
'\ "> <\/Div>'
];
/* Return the inner function object that is the result of
Evaluation of a function expression. It is this inner function
Object that will be executed on each call-
Getimginpositioneddivhtml (...)-:-
*/
Return (function (URL, ID, width, height, top, left, alttext ){
/* Assign the various parameters to the corresponding
Locations in the buffer array :-
*/
Buffar [1] = ID;
Buffar [3] = top;
Buffar [5] = left;
Buffar [13] = (buffar [7] = width );
Buffar [15] = (buffar [9] = height );
Buffar [11] = URL;
Buffar [17] = alttext;
/* Return the string created by joining each element in
Array Using an empty string (which is the same as just
Joining the elements together ):-
*/
Return buffar. Join ('');
}); //: End of inner function expression.
})();
/* ^-: The Inline execution of the outer function expression .*/