[See javascript]-variables and scope chains from jquery

jquery Fragment:

[JavaScript]View Plaincopy

2. Var
4. //would speed up references to Windows, and allows munging its name.
6. window = This ,
8. //would speed up references to undefined, and allows munging its name.
10. Undefined
12. //Map over JQuery in case of overwrite
14. _jquery = Window.jquery,
16. //Map over the overwrite
18. _$ = window.$,
22. JQuery = Window.jquery = window.$ = function (selector, context) {
24. //The JQuery object is actually just the Init constructor ' enhanced '
26. return New JQuery.fn.init (selector, context);
28. },
32. //A simple-to-check for HTML strings or ID strings
34. //(both of which we optimize for)
36. quickexpr =/^[^<]* (< (. | /s) +>) [^>]*$|^# ([/w-]+) $/,
38. //Is it a simple selector
40. IsSimple =/^. [^:#/[/.,]*$/;

Starting from this section, we peel off jquery's cloak and see what's hidden inside. As mentioned in the previous section, this implementation is definitely not a closure if you look at the outer-layer anonymous function and don't look at the implementation. However, if the implementation of jquery is added, this must be a closure application. In order to understand the closure application, it is essential to understand the foundation of a high-rise building on the ground. And this section, the fragment that we encounter, is where this foundation is--the variable. (Although this fragment contains many knowledge points, please allow me to slowly locutionary.) ）

• declaring variables

The English name of the variable is variable, and its first three letters are the keyword of the variable we declared in JS-var. So, let's start by looking at how to declare a variable:

[JavaScript]View Plaincopy

2. /*
4. * The format of the declared variable is
6. * var variable name initialize variable expression list (optional)
8. */
10. var a=1, B, c="test", d=a+b; Although B has not yet been initialized, the declaration is legal
12. alert (a); //"1"
14. alert (b); //"undefined"
16. alert (c); //"test"
18. alert (d); //"NaN"
20. Alert (e); //This will cause a compilation error: ' E ' is undefined
22. Similarly, if an undefined variable is used in the initialization, a compilation error is thrown.

As shown in the example above, declaring a variable requires the use of the VAR keyword, followed by the name of the variable after the space. While declaring variables, we can also choose to help initialize the variables. The initialized value can be any type of value or expression, but if you attempt to initialize with an undefined variable name, the JS compiler will determine that a compilation error has occurred and prevent the program from continuing to run down. Whether you initialize a declared variable or not, you can continue declaring the second variable without using the var keyword. All you need is an operator ",". (about operators are discussed in detail in a later section.) But when you do not initialize a declared variable, the variable will be given the value "undefined"--undefined is also one of the intrinsic types of JS. The operators used in PS:JS must be half-width English characters, even spaces.

• Duplicate declared variables?!

What happens when we declare a variable and then declare it again in the subsequent code? In many other languages, this can cause duplicate definitions, but in JS, this is completely legal. Also, because JS is a weak data type, variables can be given any type of value. Take a look at the following example:

[JavaScript]View Plaincopy

1. var a=1;
2. Alert (typeof a); //"number"
3. var A;
4. Alert (typeof a); //"number"
5. var a="1";
6. Alert (typeof a); //"string"
7. A=New String ("1");
8. Alert (typeof a); //"Object"

After reading the above example, you may have two questions:

A) Why is the second A or number?

b) Why is fourth a an object?

To answer the first question, let's first understand how the declaration of a variable works. And the second question, we will put him in the next section to discuss again.

• Working steps for VAR variable declaration

When we use the VAR keyword to declare a variable, the JS interpreter will do the following:

1) Pre-compiling the VAR keyword within all non-function blocks in the JavaScript code block;

2) Generate Variable name identification and allocate space at the scope where it resides;

3) Run to the first var keyword line in code order;

4) Computes the value of the initialization expression in the order of the variable declaration list expression;

5) Each calculation of an initialization expression, the result of its calculation is assigned to the corresponding declaration variable;

6) Continue to run the following code to the next var keyword;

7) Repeat 4-7 steps to the end of the code block;

8) Continue compiling to run the next block of code.

PS:JS will run a section of JS code in a block of code, which is a script tag.

Because of the way VAR works, the interpreter is virtually invisible to the VAR keyword when the program executes. He performs only the assignment of the initialization expression-so the answer to question A is that the third sentence in the example actually does nothing. So you don't have to worry about any duplicate variable names in your code. What you really need to worry about is whether the value of the variable generated by the initialization statement changes as you expect. In addition, do not attempt to use reserved words as variable names. This is a specification that must be followed in almost all languages.

Also, the working steps for declaring variables in a function block are similar, but the difference is that they are created when the function is run.

• Variable declaration without Var?!

Many friends should have this experience-"We do not need to use VAR to declare variables can also be directly assigned!" ”。 This is because when the JS interpreter encounters an assignment expression, it will first look in the scope chain to see if the variable is declared. If the variable is not declared, it is implicitly coerced to declare it in the global scope, and assigns the value of the expression to the variable.

But why on Earth is this so? In fact, everything is derived from the combination of variables ' acquiring rules and scope chains plus the catalysis of the assignment operator.

• Scope chain

Each runtime context has a scope corresponding to it. And the scope chain is the bridge that connects these scopes together. Its function is related to the program looking for a variable identifier:

1) The JS interpreter adds the scope to the scope chain in the order in which it is called (the scope of the stack-like entry is at the bottom of the scope chain);

2) then enter the first index in the scope chain when the program looks for a variable identifier, and look for the variable identifier;

3) If the identity is not found, go to the next index to continue searching;

4) If the identity has been found, the identity and its value are returned;

5) When the search to the last index still fails to find the identity, the identity is created on the last index and the value is null, and the identity and value are returned.

PS: The 5th step above occurs if the identifier is on the left side of an assignment operator expression.

Therefore, when you do not use VAR to declare a variable and directly use the variable for initialization (simple assignment), JS will automatically create the null value for you to identify, and let it smoothly execute the assignment statement.

• Variables and scope chains

From the above description, we can easily see the relationship between the variable and the scope chain. As long as the program needs to look for variables, it must pass through the scope chain. The closure problem mentioned above is the result of this. Recall our previous sample code:

[JavaScript]View Plaincopy

2. var abc=function (y) {
4. var x=y; //This is a local variable
6. return function () {
8. Alert (x + +); //That is, the x of the local variable of the first-level function in the closure attribute is called and manipulated
10. alert (y--); //reference parameter variable is also a free variable
12. }} (5); //Initialize
14. ABC (); //"5" "5"
16. ABC (); //"6" "4"
18. ABC (); //"7" "3"
20. alert (x); //Error!  "X" is undefined!

Contact us again to answer this question: How is the variable declaration and initialization in this closure executed? We will answer this question in the section "Closures".

Finally, the title of English is for everyone to better find the English literature use-because my collation will only be Chinese version. ^0^y

• About reserved Keywords (addendum)

In the ECMA-262 specification, the following keywords are specified as reserved keywords:

Break Else new Var
Case finally return void
Catch for switch while
Continue function this with
Default if Throw
Delete in try
Do instanceof typeof

These keywords cannot and are declared as variable names. But in fact, the following reserved keywords are used as future extensions:

abstract enum int Short
Boolean Export interface static
BYTE extends Long super
Char Final native synchronized
Class Float Package throws
Const GOTO Private Transient
Debugger implements protected volatile
Double Import Public

But in the actual test, the reserved keywords above, only some of the browser to some of the key words are reserved. For example, class in IE. (The measured browser is Ie6,ff3,chrome,opera). But for future compatibility, the above reserved keyword is best not used as a variable to identify as good.

• About variable identification (addendum)

The identity of the variable must meet the following requirements:

1) cannot be a reserved keyword;

2) must be preceded by an English letter or an underscore (_) or dollar sign ($);

3) Subsequent letters can be numbers, in addition to English letters or underscores and dollar signs.

In addition, JS is case-sensitive, and variable A and variable A are two different variable identifiers.

[See javascript]-variables and scope chains from jquery