Javascript notes and summaries (1-2) lexical analysis

Lexical analysis, in order to analyze 3 samples:

1th step: Analyze the parameters first

2nd Step: Re-analysis of variable declarations

3rd Step: Re-analysis function declaration

A local variable that can be used by a function is analyzed from 3 steps above.

Specific steps:

0: An active object is generated immediately before the function is run

1:1.1 the parameters of the function declaration form the properties of AO (Active Object), the values are all undefined,

1.2 Accept an argument to form the value of the AO corresponding property

2: Analysis of variable declarations , such as Var age, if there is an age attribute on the AO, there is no effect; if there is no age attribute on the AO, the AO attribute is added but is not assigned at this time and the value is undefined

3: Parse function declaration, such as function foo () {}, assign functions to Ao.foo property

Note: If the previous Foo attribute already exists, it will be overwritten into a function

Example 1

<script>    function  A (b) {        alert (b);         function B () {            alert (b);        }        b ();    }    A (1); </script>

"Answer": two times pop-up

Function B () {

alert (b);

}

Analysis

Analysis Period:

0. AO = {}

1.

1.1 Analysis Parameters AO = {b:undefined}

1.2 Receive Parameters AO = {B:1}

2. Analyze the Var declaration, where the function does not have VAR

3. Parse function declaration, AO = {b:function () {alert (b);}}

Execution Period:

alert (b); function

b (); From the scope to find B in a function, that is, Function,alert () out

Example 2

<script>    function  T (age) {        alert (age);    }    T (//5    //undefined</script>

Analysis

Lexical Analysis Process:

ao{age = undefined}

Run the process:

T (5); →ao.age = 5; alert (ao.age); 5

T (); →ao.age = undefined; Ao.age not be assigned, or undefined

Example 3

<script>    function  T (age) {        var = ten;        alert (age);    }    T (5); </script>

Eject 10.

Analysis

Lexical Analysis Process:

0. Forming ao = {}

1.

1.1 Parse Parameter AO = {age:undefined}

1.2 Receive formal parameters: AO = {Age:5}

2. analyze Var age and discover that AO has an age attribute without any effect

Execution process:

Ao.age = 10

alert (age); 10

Example 4 (compare with example 1):

<script>    function  t (greet) {        var greet = ' Hello ';        alert (greet);         function greet () {        }        alert (greet);    }    T (null); </script>

Pop up two ' hello '

Analysis

Lexical Analysis Process:

0. AO = {}

1.

1.1 Analytical Parameters:AO = {greet = undefined}

1.2 Receive formal parameters: AO = {Greet:null}

2. Analysis greet variable declaration, AO already has greet attribute, so do not have any effect

3. Parse the greet function declaration, Ao.greet = function () {}, be overwritten with functions

Execution process:

greet = ' Hello ';

alert (greet);

alert (greet);

"Re-Analysis"

var greet = ' Hello ';

This sentence should be viewed as two sentences (two executions): VAR declaration process of ① analysis period ② The assignment process of the run period

Since it was assigned a ' hello ' at runtime, the two alert pops up with ' hello '

If the sentence is removed (as in Example 1) or var greet is changed; , it pops up two times

function greet () {}

Example 5

<script>function  A (b) {    alert (b);     function () {        alert (b);    }    b ();} A (1); </script>

Popup 1 and function () {alert (b)} respectively

"Lexical Analysis Process":

0:ao = {}

1. Analysis Parameters AO = {B:undefined}→{b:1}

2. Analysis of VAR declaration, no

3. Analysis function declaration, no

Note: b = function () {alert (b)}, is an assignment procedure that does not work in the actuator

"Execution Process":

alert (b); b = 1

b = function () {

alert (b); Look up, find B = function () {}

}

b (); Funtion

"function declaration and function expression":

Functions can be assigned to variables and can be passed as arguments

function T1 () {}

And

function (){}

T1 is a function declaration, although the global also gets a T1 variable, the value is function;

T2 is just an assignment procedure, and the value is the return result of the expression on the right, which is the function

So t1 and T2 two ways in lexical analysis, there are essential differences: the former in the lexical analysis stage, the latter play a role in the function of the operation stage

For example:

(function(window,undefined) {}) (window)

This is the outermost code of JQuery.

Analysis

(function(window,undefined) {})

This is an inner expression, the return value is a function, wrapped in parentheses, as an expression to execute

(function(window,undefined) {}) (window)

Call Now

and the inner layer function does not have a name and becomes an anonymous function.

This technique, anonymous function, immediately executes, does not pollute the global, called immediately execute anonymous function expression

The window is for speed, do not pass undefined is to prevent the outside of the undefined pollution (in IE, FF low version, undefined can be re-assigned, such as undefined = 3;)

"Scope Chain"

Refers to the function from the inside out, the resulting AO chain

Lexical analysis from the outside to the inside, the analysis of the AO chain, execution from the inside out, looking for the AO chain

More lexical scopes article: lexical scopes for JavaScript

Javascript notes and summaries (1-2) lexical analysis