A detailed explanation of anonymous functions usage in JavaScript

One, what is an anonymous function?

There are generally three ways to define a function in javascript:

The code is as follows	Copy Code
1. Functions keyword (function) statement: function Fnmethodname (x) {alert (x);} 2. Functions literal (function literals): var fnmethodname = function (x) {alert (x);} 3.Function () constructor: var fnmethodname = new Function (' x ', ' Alert (x); ')

The above three methods define the same method function Fnmethodname, the 1th is the most commonly used method, the latter two are to copy a function to the variable fnmethodname, and this function is not a name, that is, anonymous function. In fact, quite a few languages have anonymous functions.

Creation of anonymous functions

The first way: this is the definition of the square function, which is one of the most common ways.

The second way:

The code is as follows	Copy Code
(function (x, y) { Alert (x + y); }) (2, 3);

An anonymous function (within the first parenthesis) is created here, and the second parenthesis is used to invoke the anonymous function and pass in the argument.

The difference between function literals and functions () constructors
1. Although the function literal is an anonymous function, the syntax allows you to specify any function name, which can be invoked when a recursive function is written, but not by using the function () constructor.

The code is as follows	Copy Code
var f = function fact (x) { if (x < = 1) return 1; else return x*fact (x-1); };

The 2.Function () constructor allows run-time JavaScript code to be dynamically created and compiled. In this way it resembles the global function eval ().
The 3.Function () constructor resolves the body of the function every time it executes and creates a new function object. Therefore, it is very inefficient to call function () constructors in a loop or in frequently executed functions. Instead, the literal volume of a function is not recompiled every time it is encountered.
4. When a function () constructor is created, it does not follow a typical scope, and it is performed as a top-level function.

The code is as follows	Copy Code
var y = "global"; function Constructfunction () { var y = "local"; Return the new Function ("Return y"); Unable to get local variable } Alert (Constructfunction () ()); Output "global"

The function () constructor has its own characteristics and is more difficult to use than the functional keyword definition, so this technique is often rarely used. The function literal expression is very close to the definition of the function keyword. Consider the previous distinction, although there is a message that the literal anonymous function has bugs under some WebKit engines under OS X 10.4.3, but our usual anonymous function refers to an anonymous function that takes the form of a function literal.

Example
The biggest use of anonymous functions is to create closures, which are one of the features of the JavaScript language, and to build namespaces to reduce the use of global variables.

Example three:

The code is as follows	Copy Code
var oevent = {}; (function () { The implementation of the var addevent = function () {//* code omits the */}; function Removeevent () {} Oevent.addevent = addevent; Oevent.removeevent = removeevent; })();

In this code, functions addevent and removeevent are local variables, but we can use it through global variable oevent, which greatly reduces the use of global variables and enhances the security of Web pages. We want to use this code: Oevent.addevent (document.getElementById (' box '),

The code is as follows	Copy Code
' Click ', Function () {});

Example four:

The code is as follows	Copy Code
var Rainman = (function (x, y) { return x + y; }) (2, 3); /** * can also be written in the following form, because the first parenthesis is only to help us read, but it is not recommended to use the following writing format. * var Rainman = function (x, y) { * return x + y; *} (2, 3); */

Here we create a variable Rainman and initialize it to 5 by calling the anonymous function directly, which is sometimes very useful.

Example five:

The code is as follows	Copy Code
var outer = null; (function () { var one = 1; function inner () { One + + 1; alert (one); } outer = inner; })(); Outer (); 2 Outer (); 3 Outer (); 4

The variable one in this code is a local variable (because it is defined within a function), so the external is inaccessible. But here we created the inner function, the inner function can access the variable one, and the global variable outer references inner, so the three call outer pops up the incremental result.