JavaScript scopes, closures, objects, and prototype chains

The original author summed up particularly well, his own collection. ^-^

1. Scope
1.1 Function scope
The local variables defined in the function by JS are only visible inside the function, which is called the scope of the function. It does not have a block-level scope (so curly braces in the If, for, etc statements are not independent scopes)

var  Value = ' global ';       var function () {        console.log (v1);    // Global       };      F1 ();       var function () {        var v1 = ' local ';         // Local       };      

Find rules for nested scope variables:
When a variable is referenced in the current function, JS searches the current function scope and, if not found, searches its upper-level scope until the global scope.

var v1 = ' global 'varfunction//var  functionvar v1 = ' Local '//Global

Lexical scope rules:
The nesting relationship of a function is determined when it is defined, not when it is called, that is, the syntax scope, that is, the nested relationship is determined by the lexical analysis, not the runtime decision.

var v1 = ' global 'varfunction//var v1 = ' Local ';};

Thus, depending on the interaction of these two rules, the local variables defined anywhere within the function are defined when entering the function, but not initialized, that is, undefined, until the variable is assigned to be initialized, so if the uninitialized variable is accessed, We'll get undefined's instructions.

1.2 Global scope
Global scope of variables when global object properties, no matter what function can be directly accessed, without the need for global objects, but with global objects, can improve the search efficiency.
Variables that meet the following conditions belong to the global scope:
A variable defined at the outermost layer, a property of a global object, and any place that is hidden.

2. Closures
2.1 Definition of Decoration

function//function//return // Get context in F1  

In a non-functional programming language such as C + + +, we can also define a function pointer and return it, but the outer function defines the context information for the inner function at the end of execution, and in the closure, the returned function is saved, and the context information of the returned function is included. (supported by the lexical scope) and after the closure is returned, the context information is created separately, allowing multiple, separate closures to be generated.

2.2 Use of closures
Closures have two uses, one is to implement nested callback functions, and the other is to hide the details of the object.
For the former, Nodejs's programming style has been able to illustrate the problem, for the latter, the function inside the local variables outside is not visible, but can provide access functions to access and modify the corresponding local variables, so as to achieve the intent of OO encapsulation.

3. Objects
In a type-based language, an object is instantiated by a class, and JS is a prototype-based system in which objects are generated by prototype replication.
3.1 Creation and access of objects

The object in JavaScript is actually an associative array of attributes, consisting of names and values. The object can be created by the new object () or {}. For creating a Simple object, you can use the object initializer to create an object, which is the {} literal value to create the objects, the object's property name can be a string of plus ', or it can be unquoted. This is no different to JS, when accessing the properties of an object, you can use a period or an associative array [' name '], the advantage of which is that when we do not know the object property name, the variable can be used as the index of the associative array.

3.2 Constructors

We can also use custom constructors to generate objects so that more objects can be instantiated. Constructors are also functions, we need to use uppercase function names. You can define member variables, member functions, and so on in a function.

3.3 Context Objects

In JS, the context object is the this pointer, which is the environment where the function is called. Its purpose is to refer to the object itself within the function to invoke it. The presence of this will have an impact on the static scope described earlier, adding dynamic content.

As can be seen from the example, we can refer to the function by different variables and invoke the context in different ways.

Transitive and binding contexts

JavaScript functions can be dynamically bound to a specific context through call and apply.

If you want to permanently bind the context, you can use the BIND function, it is important to note that multiple bind on the same function is ineffective.

var person = {name:' Noname ', getName:function() {console.log ( This  var bill = {name: ' Bill '//bill.getname =/ / name = ' JavaScript '=//

3.4 Prototypes

When creating an object, we should define a generic member within the constructor, but rather its prototype definition member function.

Below we will mainly introduce [prototype chain]

JS has two special objects: Object and function, both of which are constructors for generating objects.

Object.prototype is the ancestor of all objects, Function.prototype is the prototype of all functions, including constructors.

JS objects can be divided into three categories: User-created objects, constructor objects, prototype objects.

All objects have a __proto__ property that points to the prototype of this object.

The constructor object has a prototype, pointing to its prototype object, and when the object is created by this constructor, the __proto__ property of the newly created object will point to the prototype property of the constructor.

The prototype object has a constructor property that points to its corresponding constructor.

function Foo () {} var New Object (); var New Foo ();

Original address: http://blog.csdn.net/zzulp/article/details/8144520

JavaScript scopes, closures, objects, and prototype chains