JS Learning Note 3_ function expression

Source: Internet
Author: User

1. The difference between a function expression and a function declaration

The function declaration has an "hoisting" attribute, and the function expression does not. In other words, the function declaration is preloaded into the context when the code is loaded, and the function expression is loaded only when the expression statement is executed

2. Closures

A function that has permission to access a variable in another function scope. A closure can access a variable in another scope, so the value of the variable that the closure gets is the final value, not the value of the variable at some point, and there is a classic example:

function Createfuns () {  var result = new Array ();  for (var i = 0;i < 10;i++) {    Result[i] = function () {      return i;    };    /*    Result[i] = function (ARG) {      return function () {        return arg;      }    } (i);//Here the anonymous function immediately executes () can be omitted, because function appears to the right of the equal sign, there is no ambiguity (the general form is (function () {}))    */  }  return result;

The Createfuns function returns a set of functions that perform the result of 10 (the value of the resulting variable is the final value), but the way the function is returned in the comment is the current value of I, because the value is passed

3. This in the function expression

An intrinsic function cannot directly access the this and arguments objects in an external function, because an intrinsic function searches for both of these variables so that only its active object is searched.

P.S. The active object is the entity of the scope chain, the scope chain is the abstract concept, and the active object is the concrete implementation of this concept. In fact, the scope chain map to the code is the variable object chain, and pull out the variable object, not afraid, not complicated:

All variables and functions defined in the execution Environment (context) are stored in the variable object, and if the execution environment is a function, the active object of the function is treated as a variable object and as a link of the variable object chain, that is, the chain of scope.

The active object of the start function has only one property--arguments object, and each declaration of a custom property inside the function adds a property to the active object of the function ...

Well, that's a lot to say: Thisis the reference to the active object/variable object .

If you do not understand, please refer to the post of the predecessor, incidentally, the other blog post , about JS is very good

4. Declaring variables repeatedly

does not cause a syntax error, the redundant declaration is automatically ignored, but the simultaneous initialization of the declaration is performed, for example:

var x = 1;var x = 2;//var declaration is ignored, so no error is given, but assignment is executed alert (x);//2
5. The idea of implementing block-level scopes

Declaring an anonymous function and invoking it immediately, the inside of an anonymous function is a block-level scope. Specific implementation:

(function () {/* block-level scope */}) ();

Note: It is necessary to use parentheses to disambiguate function expressions from function declarations (this is the case from the interpreter's perspective), since function declarations cannot be directly followed by parentheses, and function expressions can.

P.S. The code in the example is just one way to implement Iife, and there are several, refer to [javascript]iife function expression immediately executed, this post gives a detailed comparison

6. Private variables

Variables declared inside a function with Var or function are private variables. (the instance cannot be accessed directly and can be provided by defining a public function to provide the provider)

The variable declared with this.attr = value is a public variable. (instance can be accessed directly)

7. The difference between closures, anonymous functions, intrinsic functions, and internal anonymous functions
    • Closures: Functions that have access to variables in another function scope

    • anonymous function: function expression with no Name

    • intrinsic function: A function declared inside a function, that is, a closed packet

    • Internal anonymous function: An anonymous function declared inside a function, and, of course, a closure

P.S. Abusive closures can consume a lot of memory, and closures can access variables in the scope of the outer function because the enclosing active object holds a reference to the outer function's active object

Only after the closure has been destroyed can the variables in the outer function be destroyed, not destroyed in time , and therefore may consume a lot of memory

8. The entire process of executing a function
    1. Create execution Environment Context,context has internal properties [[Scope]]

    2. Update Scope chain Scopechain

    3. Create an active object

    4. Initializes the properties of this, arguments, parameter, and so on of the active object

    5. Executing function body

    6. Destroying the active object (cannot be destroyed when there is a closure)

    7. Update Scope chain

9.js single case mode and module mode
    • Singleton mode: Create a pattern of objects with only one instance, in plain view, patterns are methods, and design patterns are a good way for predecessors to summarize them. The realization of the singleton mode in JS is especially simple:

      var singleton = {attr1:value1, attr2:value2};

      Yes, it is the object literal, in fact, is to create an anonymous object, do not know the name of the constructor, of course, can not create a 2nd instance

    • Module mode: Douglas proposes a way to augment a singleton by adding a private property and a public attribute (sometimes called a privileged attribute) to a singleton, such as a property that has permission to modify a private property, for example:

      var singleton = function () {  //private attribute  var privatestr = ' secret ';  function Addprefix () {    Privatestr = ' This is my ' + privatestr;  }  Public attribute (privileged property)  return{//Returns an anonymous object    getstr:function () {      addprefix ();      return privatestr;}}  ;} ();//The anonymous function immediately executes alert (SINGLETON.GETSTR ());

P.S. If you do not need a singleton, just protect the private property, you can do this:

function Cat () {  ///Private attribute  var privatestr = ' secret ';  function Addprefix () {    Privatestr = ' This is my ' + privatestr;  }  Public attribute (privileged attribute)  This.getstr = function () {    addprefix ();    return privatestr;}  } var obj = new Cat (); alert (Obj.getstr ());
References
    • What is this: The post of a predecessor

    • The anonymous function executes immediately in several ways: [javascript]iife function expression immediately executed

JS Learning Note 3_ function expression

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.