JS Pre-compilation

Source: Internet
Author: User

Encapsulating the code in the form of a function can reduce the coupling of the code (programming pursues high cohesion, weak coupling)

function declaration:

function SayHello () {

Console.log (' Hello World ')

}

function expressions: (generally referred to as anonymous function expressions)

Named function Expressions:

var say = function SayHello () {

Console.log ("Hello World")

}

An anonymous function expression:

var say1 = function () {

Console.log ("Hello World")

}

The only difference between a named function expression and an anonymous function expression:

Console.log (say.name) ==> SayHello

Console.log (say1.name) ==> say1

Before ES5, there were two types of scopes: global scope, local scope (also called function scope)

1. Any variable, if the variable is assigned without being declared, the variable is globally owned
A 2.arguments class array object that records all the argument sets

Each function generates its own scope

var a = 123;

function Fun () {

var c = 234;

Console.log (A,C) ==> has a return value (a variable that can access the global scope in a local scope)

}

Fun ();

Console.log (a) ==>a is a global variable with a return value

Console.log (c) ==>c as local variable, not in global scope, error (variable that cannot access local scope in global scope)

Note Console.log (name) does not error, name is the own property of window

Before the function is executed, the browser does 3 things before executing the function fun ():

1. Syntax Analysis detection code There is no low-level error (there will be an error)

2. Pre-compilation

3. Line-by-row execution according to the compiled

Pre-compilation:

1. An Ao object (Active object), called AO, is generated for the moment before the function is run, and the execution period context

2. Parse parameters, formal parameters as property names of AO objects, arguments as property values of AO objects

3. Analyze the variable declaration, the variable name is the property name, the value is undefined, if you encounter the same name do not make any changes

4. Parse function declaration, function name is property name, function value is function body, if you encounter direct overwrite with same name

Once a function is executed, a pre-compilation process is generated, and precompilation is the pre-execution procedure

Instance:

function Fun (a) {

var B = 123;

Function C () {

var d = 234;

}

}

Fun (6);

Pre-compilation:

1. Create an AO object (go for function C) in a moment before the function fun runs

Fun. AO = {};

2. Analysis parameters (if not, skip)

Fun. AO ={

A:6

}

3. Analyze variables (if not, skip)

Fun. AO ={

A:6,

b:undefined

}

4. Analysis function declaration (if not, skip), End:

Fun. AO ={

A:6,

B:undefined,

C:function () {

var d = 234;

}

}

Then execute the function according to the AO object, and when the function executes, the AO object is automatically destroyed

Scope:

Global scope--relative
function scope--The scope of your own is generated whenever a function is present

The function itself is also an object
Fn.name
Fn.length
Fn.prototype
Fn.[[scope]] not see the properties, to the system to read a simple understanding: Put the Go and AO
The set of [[scope]] forms a chain form, forming a scope chain, essentially a JavaScript object

Execution context: When the function executes, it creates an internal object for the execution period, storing the defined variables, functions ...
The execution period context is unique, and whenever you call a function, a new execution period context is generated, and when your function is completed, the execution context is destroyed.

Closures:

function A () {
var num = 100;
Function B () {
num + +;
Console.log (num);
}
return b;
}
var demo = a ();
Demo () "101
Demo () "102

B--Demo () B.[[scope]] 0:b.ao num++
1:a.ao
2:go

Cons: Scope chains are not released, resulting in memory leaks

Benefits: Accumulator
Do cache
Packaging
Modular development to avoid global contamination

Internal variables can only be accessed or manipulated through the specified interface


Closed packet Cache

function Test () {
var num = 100;
function A () {
num + +;
Console.log (num)
}
Function B () {
Num--;
Console.log (num)
}
return [A, b]
}
var arr = Test ();
Arr[0] ();
ARR[1] ();

JS Pre-compilation

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.