JavaScript function 2: function expressions

Another method that can replace the function declaration is the function expression. The explanation is as follows: the bit of the expression must appear in the source code.

Another method that can replace the function declaration is the function expression, which is interpreted as follows:

Function expression

Function expressions (FE) are such functions:

1. Must appear in the expression position in the source code
2. Available names
3. Does not affect variable objects
4. Create in code execution stage

The main feature of this function type is that it is always at the expression position in the source code. The simplest example is a value assignment statement:

var foo = function () {  ...};

In this example, an anonymous function expression is assigned to the variable foo. Then, the function can use the name foo to access -- foo ().

As described in the definition, function expressions can also have optional names:

var foo = function _foo() {  ...};

Note that the external FE accesses -- foo () through the variable "foo", while the name "_ foo" may be used inside the function (such as recursive call ".

If FE has a name, it is difficult to distinguish it from FD. However, if you understand the definition, it is easy to distinguish: FE is always at the position of the expression. In the following example, we can see various ECMAScript expressions:

// The parentheses (grouping operators) can only be the expression (function foo () {}); // The array initializer can only be the expression [function bar () {}]; // you can only operate on expression 1 and function baz (){};

The expression definition indicates that FE can only be created in the code execution stage and does not exist in the variable object. Let's look at a sample behavior:

// FE is unavailable before the definition phase (because it is created during code execution) alert (foo); // "foo" undefined (function foo (){}); // The definition phase is not available after it is defined because it is not alert (foo) in the variable object VO; // "foo" is not defined

A considerable number of problems have emerged. Why do we need a function expression? The answer is obvious-use them in expressions, and "will not pollute" variable objects. The simplest example is to pass a function as a parameter to other functions.

function foo(callback) {  callback();} foo(function bar() {  alert('foo.bar');}); foo(function baz() {  alert('foo.baz');});

In the preceding example, FE is assigned a variable (that is, a parameter). The function stores the expression in the memory and accesses it through the variable name (because the variable affects the variable object ), as follows:

var foo = function () {  alert('foo');}; foo();

Another example is to create an encapsulated closure to hide auxiliary data from an external context (in the following example, we use FE, which is called immediately after creation ):

Var foo = {}; (function initialize () {var x = 10; foo. bar = function () {alert (x) ;}) (); foo. bar (); // 10; alert (x); // "x" undefined

We can see that the function foo. bar (through the [Scope] attribute) accesses the internal variable "x" of the function initialize ". In addition, "x" cannot be accessed externally. In many libraries, this policy is often used to create "private" data and hide auxiliary entities. In this mode, the names of the initialized FE are usually ignored:

(Function () {// initialization scope })();

Another example is to create FE using conditional statements during code execution without polluting the variable object VO.

var foo = 10; var bar = (foo % 2 == 0  ? function () { alert(0); }  : function () { alert(1); }); bar(); // 0

Additional reading

The topic list of this article is as follows:

1. How should we understand the working principle of the JavaScript engine?
2. JavaScript exploration: the importance of writing maintainable code
3. JavaScript exploration: exercise caution when using global variables
4. JavaScript exploration: var pre-parsing and side effects
5. JavaScript exploration: for Loop (for Loops)
6. JavaScript exploration: for-in loop (for-in Loops)
7. Exploring JavaScript: Prototypes is too powerful
8. JavaScript: eval () is the devil"
9. JavaScript exploration: Using parseInt () for Numerical Conversion
10. Exploring JavaScript: Basic coding specifications
11. JavaScript exploration: function declaration and function expression
12. JavaScript exploration: Name function expressions
13. JavaScript: function name in the debugger
14. JavaScript: JScript Bug
15. JavaScript exploration: Memory Management of JScript
16. Exploring JavaScript: SpiderMonkey's quirks
17. JavaScript exploration: an alternative solution to naming function expressions
18. JavaScript exploration: Object
19. JavaScript exploration: Prototype chain
20. JavaScript exploration: Constructor
21. JavaScript probing: executable context Stack
22. Execution context 1: Variable object and activity object
23. Execution context 2: Scope chain Scope Chains
24. Execution context 3: Closure Closures
25. Execution context 4: This pointer
26. Exploring JavaScript: Powerful prototype and prototype chain
27. JavaScript Functions 1: function declaration
28. JavaScript function 2: function expressions
29. JavaScript function 3: function expressions in a group
30. JavaScript function 4: function Constructor
31. JavaScript variable object 1: VO Declaration
32. JavaScript variable object 2: VO in different execution contexts
33. JavaScript variable object 3: two stages of execution Context
34. JavaScript variable object IV: Variables
35. Property of the JavaScript variable object __parent _
36. JavaScript scope chain 1: Scope chain Definition
37. JavaScript scope chain 2: function Lifecycle
38. JavaScript scope chain 3: Scope chain features
39. JavaScript closure 1: Introduction to closures
40. JavaScript closure 2: Implementation of closure
41. JavaScript closure 3: Closure usage

Address of this article: http://www.nowamagic.net/librarys/veda/detail/1663,welcome.