Examples of JavaScript function expressions and javascript expressions

Examples of JavaScript function expressions and javascript expressions

JavaScript function expression

I. Sequencing

There are two methods to define a function: function declaration and function expression;

1.1 function declaration

Function functionName (arg) {// function body}

An important feature of function declaration is the improvement of function declaration, which means that function declaration is read before code execution. This means that the function can be placed behind the statement that calls it. As follows:

Helloworld (); // The function declaration function helloworld () {console. log ("hello world") will be read before the code is executed ");}

1.2 function expressions

Var functionName = function (arg) {// function body}

This form looks like a regular variable assignment statement, that is, creating a function and assigning it to the variable functionName. In this case, the created function is called an anonymous function. Because the function keyword is not followed by an identifier.

Like other expressions, function expressions must be assigned a value before use. For example, the following code may cause errors;

Helloworld (); // error. No value has been assigned. The function does not exist var helloworld = function () {console. log ("hello world ");}

With the function expression, we can dynamically assign values to the function expression, as shown in the following code:

Var helloworld; // declare if (condition) {// condition helloworld = function () {// assign a value to the console. log ("hello world") ;}} else {helloworld = function () {// assign a value to console. log ("Hello, world ");}}

Ii. recursive functions

Recursive functions are constructed when a function calls itself by name (similar to languages such as C #, so the core idea of a program is similar, but there are some differences in syntax, to learn the basics of a language, you can easily learn other things.) for a typical recursive interview question, the rule for one column is as follows: 1, 1, 2, 3, 5, 8, 13, 21, 34 ...... The Code is as follows:

   function foo(n) {      if (n <= 0)        return 0;      else if (n > 0 && n <= 2)        return 1;      else        return foo(n - 1) + foo(n - 2);    }

Although this function seems to have no problem, the following code may cause it to fail:

   var foo1 = foo;    foo = null;    console.log(foo1(34));

The code above first saves the foo () function in the variable foo1, then sets the foo variable to null, and points the result to only one reference of the original function. However, when you call foo1 (), foo () must be executed, and foo is null, which leads to an error. In this case, arguments is used. callee can solve this problem. Arguments. callee is a pointer to the function being executed, so you can use it to implement recursive calls to the function.

 function foo(n) {      if (n <= 0)        return 0;      else if (n > 0 && n <= 2)        return 1;      else        return arguments.callee(n - 1) + arguments.callee(n - 2);    }

You can also use the name function expression to achieve the same result. For example:

 var foo = (function f(n) {      if (n <= 0)        return 0;      else if (n > 0 && n <= 2)        return 1;      else        return f(n - 1) + f(n - 2);    });

3. Closure

3.1 A closure is a function that has the right to access the variables in another function scope. A common way to create a closure is to create another function within a function. To understand closures, you must first understand the scopes of special JavaScript variables. The scope of variables is nothing more than two types: global variables and local variables. Next we will write several demos to express them intuitively;

The function directly reads global variables:

Var n = 100; // define a global variable function fn () {console. log (n); // The function directly reads the global variable} fn ();

The function cannot directly read local variables:

    function fn() {      var n = 100;    }    console.log(n); //n is not defined

Note that when declaring a variable in the function, you must use var. If it is useless, it will become a global variable:

 function fn() {       n = 100;    }    fn();    console.log(n); //100

Sometimes we need to get the variables declared inside the function, so we can use the common method of creating a closure mentioned above to create another function inside the function:

   function fn() {      n = 100;      function fn1() {        console.log(n);      }      fn1();    }    fn(); //100

In the above Code, the function fn1 is included in the function fn. At this time, all local variables in the fm are visible to fn1. However, in turn, the local variables in fn1 are invisible to fn. This is the "chain scope" structure exclusive to the Javascript language. The sub-object will look up the variables of all parent objects at a level. Therefore, all variables of the parent object are visible to the child object, and vice versa.

Fn1 can read internal fn variables, so as long as fn1 is taken as the return value, we can read fn variables externally.

function fn() {      n = 100;      function fn1() {        console.log(n);      }      return fn1;    }        var result=fn();    result(); //100

Fn1 is the closure, and closure is the function that can read internal variables of other functions. In Javascript, only the subfunctions in a function can read local variables. Therefore, you can simply understand the closure as a function defined in a function ". Therefore, in essence, closure is a bridge connecting the internal and external functions of a function.

3.2 use of closures

It has two major functions: one is to read the internal variables of the function mentioned above, and the other is to keep the values of these variables in the memory. As shown in the following code:

function fn() {      n = 100;      nadd = function () {        n += 1;      }      function fn1() {        console.log(n);      }      return fn1;    }    var result = fn();    result(); //100    nadd();    result(); //101

Note: Because the closure function carries the scope of the function that contains it, it will occupy more memory than other functions. Excessive use of the closure may cause excessive memory usage, therefore, before exiting the function, delete all unused local variables.

 Iv. Block-level scope

The syntax for block-level anonymous functions (also known as private scopes) is as follows:

(Function () {// block-level scope })();

You can use private scopes wherever you need some variables temporarily, for example:

(Function () {var now = new Date (); if (now. getMonth () = 0 & now. getDate () = 1) {alert ("Happy New Year ");}})();

Put the above Code in the global scope. If it is in January 1, the "Happy New Year" Blessing will pop up. This technology is often used outside the function in the global scope, this restricts the addition of excessive variables and functions to the global scope. In general, we should add as few variables and functions to the global scope as possible. In a large application involving many developers, too many global variables and functions can easily lead to name conflicts. By creating private scopes, each developer can use their own variables without worrying about messing up global scopes.

Thank you for reading this article. I hope it will help you. Thank you for your support for this site!