JavaScript functions, scopes, closures

Source: Internet
Author: User

Functions have two functions , one is the declaration creation function , the declaration creates a function object, and the other is the function of running , logical operation in the function body.

First look at the following example:
function Fn () {Console.log ("FN")};
Fn ();
The first sentence is the declaration of the function , and the second sentence is when the function is run . Objects of type functions have more runtimes than objects of type object. So let's take a look at the two times, what did the function do?

function When declaring : Creates a Function object (as the property of the OA object of the current function object, which is understood to be read at run time), and adds some hidden property objects to the function object.
1, __proto__, points to its prototype, pointing to Function.prototype by default, while function.prototype.__proto__ points to object.prototype;
2. prototype. This is the prototype of the instance object it was created in, which also defaults to the Protoype.constructor = = function name,
3. Length: The number of formal parameters,
4. Scope object (unreachable), can be considered as a stack structure (last in first out), the function declaration is in the function object's Vo object reference to the top of the stack
There are some other hidden objects that I did not study.

Function at run time:

1, the dynamic designation this, can be specified by A.FB (), Call,apply,bind, and so on, if it is new, then this point to {}, but if you do not specify this, then this is the point to the global object ( Note This cannot be assigned by this = a method)
2. Create an Argument object arguments, which resembles an array and stores the argument values.
3, the AO object (the active object) is created, and the scope of its function object refers to the reference of the OA object to the top of the stack, if there are arguments, processed by internal variables, and referenced arguments, in order. The object of the Var declaration in the function ( The initial value is undefined) or the object declared by the function (at this point, the functions object is also created, its identifier points to the function object created by the newspaper), so var a = function () {}; and function A () {} At this time the processing is different, The initial value of Var mode A is undefined, and then the function object is created when it is run to, and a points to the function object that was just created, and function A () {} is not yet run to this sentence, a functional object has been created, and a points to the function object.
4. Start in sequential execution, if there is a value, look in the scope of the current function (scope lookup mechanism, the object's property values are found by the prototype chain), to find the global object directly (the end of the scope of the OA object), Then find the prototype of Globa Object.prototype if not found, the value is undefined. If you execute to return, if you do not specify a return value, the object to which this is pointing is returned. So the new operation is just beginning to point to {}, Returns the object to which this is pointed by default, and returns the specified object. The resulting instance pairs the __proto__ value of the image to the prototype object of the function object, The constructor of the prototype of the function object refers to the instance type of the instance object. When the function returns: Cleans up the battlefield work, if the returned object is not referenced to the object, it is referred to the GC, if the returned object has a reference to this object, such an object cannot be cleaned up,

See the following example to see what the scope chain and closures are:

function Fn () {//!.
3
var B = 4; 4
function Fb () {
9
b = b+6; 10
Console.log (b); 11
}
var Fc = function () {//5
13
b = b-2; 14
Console.log (b); 15
}
return {fb:fb,fc:fc}//.6

}

var fn = fn (); 2//7

FN.FB (); 8
FN.FC (); 12

See the marked number, indicating the order of execution.
1.Fn function declaration, this isScope of FNYesGlobal OA Object, and Fn as a property of this global OA object, Fn.__proto__==function.prototype
2.when the FN function runs, enter the function body, createthe OA object of FN, which specifies that this is global, and that the OA object of FN is added for the scope of FN, at which pointthe scope of FN has global OA and FN OA
3. Create objects for Var and function declarations within functions,the value of the Var declaration is undefined, Funtion declares a function object and creates its OA object for the function object that is created. In this step, you can get B = undefined; Fb=[function]; FC = undefined; Note the difference between FB and FC. At this time the FB is already a declaration created,then the FB object will create a scope object, and the FN scope object to the FB scope object, then the scope of the FB also has the global OA and FN OA
4.b = 4;
5. It's time to entercreation of FC declarationsThe creation of the reference FB when it was created, get fc=[function]
6. Create the {FB:FB,FC:FC} object and return this object
7. Assign the returned {FB:FB,FC:FC} value to the FN
8. Enter the FB function, create the FB OA object, and the FB OA object into the FB Spoce, then the scope of the FB now has global OA,FN OA and FB Oa.this designated as FN,
9. handling var and function declarations, but not within the FB function, so there is nothing to deal with here.
10. In the scope chain to find B, first in the FB OA, did not find B, then live on, in the FN OA found B, at this time the B value is 4, so the operation, get b=10,
11. Output 10
12. Similar to the 8th step
13. Similar to the 9th step
14. Similar to the 10th step, first found in the FC Oa, did not find B, then live on, in the FN OA found B, at this time the B value of 10, so the operation, get B=8,
15. Output 8
Understanding the process above makes it easy to understand the scope chain and closure. The so-called closure is the return of the result of the function OA reference, resulting in the function OA can not be cleaned up, so the declared variables in OA can not be cleaned, and saved the state.

JavaScript functions, scopes, closures

Related Article

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.