JavaScript Object-oriented programming (OOP)--Summary

Directory

• The parsing and executing process of JS
  • preprocessing phase
  • Implementation phase
• Second, scope
  • Block scope
  • function scope
  • Dynamic scopes
  • Lexical scopes
• Three, closed package
  • What is a closure package
  • Benefits of closures
• Iv. Classes and objects
  • Object
  • Class
  • Prototypes (prototype)
  • This
  • Understanding of New
• Five, Package
• Vi. Succession
• Seven, polymorphic
• Eight, the project actual combat minijquery

The parsing and executing process of JS

1.1. pretreatment phase

Note: JS preprocessing phase will scan all Var declared variables, the Var declared variables or functions into the lexical scope, if the initial value of the variable is "undefined", if the function is pointing to the function;

Global (window)

　　 Lexical scope (Lexical environment): The top Lexical environment is window;

1. Scan variables after function declaration (Var declaration);

2, the processing function declaration has a conflict, will overwrite the variable declaration when processing a conflict, will be ignored.

Function

　　Lexical scope (Lexical environment): Every call, produces a Lexical environment;

1, the parameters of the first function: such as arguments(function inside the object, representing the function arguments, can be obtained by the subscript call function simultaneous argument);

2. Scan variables after function declaration (Var declaration);

3, the processing function declaration has a conflict, will overwrite the variable declaration when processing a conflict, will be ignored.

1.2. Implementation phase

1. Assigning values to members of the preprocessing phase

2. If there is no variable declared with Var, it becomes the member of the most external lexicalenvironment (that is, the variable of the Window object)

Function Inner object: arguments

<script>/*Tips:*/    //arguments is an object inside each function//You can access the information that is actually passed to the function's arguments. //the number of arguments at the time of declaration is irrelevant to the actual invocation .function Add (A, b) {console.log (add.length);//number of formal parametersConsole.log (arguments.length);//the actual parameters passed overvar total = 0;  for(var i = 0;i< arguments.length;i++) { Total+=Arguments[i]; }    returnTotal//returns the sum of the arguments    }        //calling the simultaneous argumentvar result = Add (1,2,3,4,5); var result2= Add (); Console.log (result);// theConsole.log (RESULT2);//3</script>

View Code

Second, scope

Tip: The scope of JS is not block level; JS is scoped to the function level.

2.1. Block scope

2.2. Function scope

2.3. Dynamic scope

2.4. Lexical scopes

code example:

<script>//JS Scope//definition: A ruleset used to find the value of a variable;//tip: The scope of JS is not block level; JS is scoped to the function level. //JavaScript uses lexical scopes, and its most important feature is that its definition process takes place in the writing phase of the code.                        /*The following JS code is used for immediate invocation (privatization) to avoid variable collisions*/                        //1, block scope: code in curly braces valid (JS no block scope)(function () { for(Var i=0;i<5;i++) {var a=i; }                //outside the curly braces you can access the I,aConsole.log (i);//5Console.log (a);//4            })(); //2, function scope: code in the function () functions of the curly braces valid(function () {var message= "Outside of function"; function fn () {var message= "Inside of function"; Console.log (message);//inside the function} console.log (message);//outside of the function            })(); //3, dynamic scope: at runtime to determine (is the performance of this point; who calls, this is WHO); the dynamic scope actually refers to the lexical scope of this//Dynamic scopes do not care about how functions and scopes are declared and declared at any point, only about where they are called from. //In other words, the scope chain is based on the call stack, not the scope nesting in the code(function () {var a= 2;                function foo () {console.log (a); } function bar () {var a= 3; Foo ();//at this time This===window} bar ();//2            })(); /*var a = 2;                Bar = {A:3, foo:function () {console.log (THIS.A); }} bar.foo ();//3*/                        //4. Lexical scopes: Lexical scopes (also known as static scopes or closures)//JS scope parsing, creating functions with new function(function () {//Closed Packagevar a = 2; function bar () {var a= 3; returnfunction () {console.log (a);//capture A=3 at this time                    }; } var foo=Bar (); Foo ();//3            })(); //If you are in the lexical scope, which is now the JavaScript environment. The variable A is first found in the Foo () function and is not located. It then finds and assigns a value of 2 along the scope chain to the global scope. So the console output 2//If you are in a dynamic scope, the variable A is first looked up in Foo () and is not found. This will follow the call stack in the call to the Foo () function, the bar () function, find and assign a value of 3. So the console output 3//Summary: The difference between the two scopes, in short, lexical scopes are determined at the time of definition, while dynamic scopes are determined at run time</script>

View Code

Three, closed package

3.1, what is the closure of the package

3.2. Benefits of closures

Iv. Classes and objects

4.1. Objects

4.2. Class

4.3. prototype (prototype)

4.5, this

4.6. Understanding of New

Simple can be understood as new

V. Encapsulation Six, succession seven, polymorphism eight, the project actual combat minijquery

JavaScript Object-oriented programming (OOP)--Summary