Good detailed analysis of variables in JS_javascript skills

Here I will discuss my understanding of the details related to variables in Javascript. If there is any inappropriateness, please comment.

1. Types of variables
Javascript is different from languages ​​such as Java and C. It is an untyped, weakly detected language. Its definition of variables does not require declaring the variable type. We can assign various types of data to the same variable through assignment. For example:


i=100;//Number type
i="variable";//String type
i={x:4};//Object type
i=[1,2,3];//Array type

Although this feature of JS makes our coding more flexible, it also brings a drawback, which is not conducive to debugging and weak detection of the compiler. It makes maintaining lengthy code quite painful.

2. Declaration of variables
Variable declarations in JS are divided into explicit declarations and implicit declarations.


　var i=100;//Explicit declaration
i=100;//Implicit declaration

Use the var keyword in the function to explicitly declare variables It is used as a local variable instead of using the var keyword. It is a global variable declared using direct assignment.​

When we access an undeclared variable, JS will report an error. When we assign a value to an undeclared variable, JS will not report an error. On the contrary, it will think that we want to implicitly declare a global variable. This must be paid attention to.


3. Global variables and local variables
When the JS parser is executed, it will first build a global object in the execution environment. The global properties we define are properties of the object. Read, in the top-level code we can access it using the this keyword and the window object. The local variables in the function body only exist in the calling object generated when the function is executed. The local variables are destroyed immediately when the function is executed. Therefore, in programming, we need to consider how to declare variables reasonably, which not only reduces unnecessary memory overhead, but also largely avoids the debugging trouble caused by repeated definition of variables and overwriting previously defined variables.

4. Variable Scope
The scope of variables is a critical detail in any programming language. The scope of variables in JS is relatively free compared to languages ​​​​such as JAVA and C. A big feature is that JS variables do not have block-level scope. The variables in the function are valid in the entire function. Run the following code:





The output result is 0 1 0. From the above, it can be proved that if JS uses var to declare a variable in the function body, then this variable is valid in and only within the function body. When the function ends, the local variable can be destroyed.
Due to the above JS features, there is another key issue that needs attention. ActionScript has been used before. Although it and JS are both based on the ECMA standard, it is slightly different here. For example, the following code:




You may think that the output result is 0 0 1 0. In fact, this is indeed the case in AS, but the input in JS is 0 undefined 1 0, why is this happening? We just mentioned that the local variables declared in the JS function body are valid in the entire function, so in the above code var　i = 1; are valid in the inner function. In fact, the explicitly declared variable i is precompiled. It has been compiled into the calling object. Unlike implicitly declared variables, which are defined as global variables when interpreted, the variable has not been initialized when outPut(i) is called. At this time, the local variable i is an unassigned variable. , instead of undefined variables, so undefined is output. The above code is equivalent to the following code:


function inner(){
var i; // Define but not assign a value
outPut(i); // undefiend
i =1;
outPut(i); //1
}
In order to avoid the above problems, it is highly recommended to make function declarations at the beginning of the function.

5. Basic types and reference types
Unlike languages ​​such as JAVA and C, JS does not need to declare the storage space of the variable when declaring the variable. The data stored in variables can be divided into two categories: basic types and reference types. Among them, numeric values, Boolean values, null and undefined are basic types, and objects, arrays and functions are reference types.
Basic types have a fixed memory size in memory. For example: Numeric type occupies eight bytes in memory, and Boolean value only occupies one byte. For reference data, they can have any length, so their memory size is variable, so what is stored in the variable is actually a reference to the data, usually a memory address or pointer, through which we can find the data.
There are also differences in usage behavior between reference types and basic types:





When assigning a value to basic type b, another area is actually opened up memory space, so changing the value of variable a has no effect on variable b.


<script> <BR>//定义一个输出函数 <BR>function outPut(s){ <BR>document.writeln(s) <BR>} <BR>//全局变量 <BR>var i=0; <BR>//定义外部函数 <BR>function outer(){ <BR>//访问全局变量 <BR>outPut(i); // 0 <BR>//定义一个类部函数 <BR>function inner(){ <BR>//定义局部变量 <BR>var i = 1; <BR>// i=1; 如果用隐式申明　那么就覆盖了全局变量i <BR>outPut(i); //1 <BR>} <BR>inner(); <BR>outPut(i); //0 <BR>} <BR>outer(); <BR></script> <script> <BR>//定义一个输出函数 <BR>function outPut(s){ <BR>document.writeln(s) <BR>} <BR>//全局变量 <BR>var i=0; <BR>//定义外部函数 <BR>function outer(){ <BR>//访问全局变量 <BR>outPut(i); // 0 <BR>//定义一个类部函数 <BR>function inner(){ <BR>outPut(i); //undefiend <BR>var i=1; <BR>outPut(i); //1 <BR>} <BR>inner(); <BR>outPut(i); //0 <BR>} <BR>outer(); <BR></script><script> <BR>//定义一个输出函数 <BR>function outPut(s){ <BR>document.writeln(s) <BR>} <BR>var a = 3; <BR>var b = a; <BR>outPut(b); <BR>//3 <BR>a = 4; <BR>outPut(a); <BR>//4 <BR>outPut(b); <BR>//3 <BR></script><script> <BR>//定义一个输出函数 <BR>function outPut(s){ <BR>document.writeln(s) <BR>} <BR>var a_array = [1,2,3]; <BR>var b_array = a_array; <BR>outPut(b_array); //1,2,3 <BR>a_array[3] = 4; <BR>outPut(b_array);//1,2,3,4 <BR></script> The above are variable assignments of reference types. In fact, they pass a reference to the memory address, so the access to a_array and b_array , in fact, they all operate on the same memory area.If I want to reallocate memory space to store reference variables, then I need to use the cloning method or a custom method to copy the data of the reference variable.