Shulou(Shulou.com)06/02 Report--

This article introduces "how to master js scope chain, memory recovery, variables, closures" related knowledge, in the actual case of the operation process, many people will encounter such a dilemma, and then let the editor lead you to learn how to deal with these situations! I hope you can read it carefully and be able to achieve something!

First, scope chain: an index created by a function at the time of definition to find the value of the variable used, while its internal rule is to put the local variable of the function itself first, the variable in its own parent function second, the variable in the higher-level function later, and so on until the global object. When the function needs to query the value of a variable, the js interpreter will go to the scope chain to find it, first from the first local variable, if the corresponding variable is not found, then look for it on the chain at the next level, once the variable is found, it will not continue. If * * is found and the required variable is not found, the interpreter returns undefined.

Second, memory recovery mechanism: at the beginning of execution, a function will divide the memory space for the variables defined in it for the use of the following statements. When the function is completed and returned, these variables will be considered useless. The corresponding memory space is reclaimed. The next time this function is executed, all variables return to their original state and are re-assigned. But if there is another function nested inside the function, and this function may be called externally. And this internal function uses some variables of the outer function. There will be problems with this memory recovery mechanism. If the internal function is called directly after the external function returns, then the internal function cannot read the value of the variable in the external function it needs. So when the js interpreter encounters a function definition, it automatically saves the function with the variables it may use (including local variables and variables of parent and ancestor functions (free variables). That is, to build a closure, these variables will not be reclaimed by the memory collector, and the closure will be destroyed only after the internal function cannot be called (for example, deleted, or without a pointer). Variables referenced by none of the closures will be reclaimed when the next memory collection starts.

Local variables & global variables

1, the scope of the global (global) variable is global, which is defined everywhere in Javascript; while the variable declared inside the function is a local (local) variable, and its scope is local, which is only defined within the function body, and the variable will be created and destroyed every time the function is executed.

2, the use of variables in the scope of global variables can not be varstatement, but in the declaration of local variables must use varstatement, otherwise it will be regarded as a reference to the global variable.

3 、

Var scope = "local"; the declared variable is valid throughout the scope of the checkScope function, so * [xss_clean] (scope); when executed, the scope refers to the local variable, and the local variable scope is not defined, so output "undefined". A good programming habit is to put all variable declarations together at the beginning of the function. [xss_clean] (window.scope) / / output global

Global variables always exist at the end of the runtime context scope chain, so finding global variables is the slowest when resolving identifiers. Therefore, when writing code, you should use as few global variables as possible and local variables as much as possible. A good rule of thumb is that if a cross-scope object is referenced more than once, store it in a local variable before using it (document, window, etc.).

During the execution of JavaScript code, when an identifier is encountered, a search is made in the scope chain of the execution context (Execution Context) based on the name of the identifier. Start with the * * objects of the scope chain (the Activation Object object of the function), and if not, search for the next object in the scope chain, and so on, until the definition of the identifier is found. If an object in the scope, that is, the global object (Global Object), is not found after searching for it, an error will be thrown indicating that the variable is not defined (undefined). This is the process of function execution model and identifier parsing (Identifier Resolution) described in the ECMA-262 standard.

Defined by the third edition of the ECMA-262 standard, this internal attribute contains a collection of objects in the scope in which the function is created, which is called the function's scope chain, which determines which data can be accessed by the function. Scope * objects are always variable objects in the environment in which the code is currently executed

Function a (XBI y) {

Var b=x+y

Return b

}

When the function an is created, its scope chain is filled with the global object, which contains all the global variables.

Var tatal=a (5 and 10)

When this function is executed, an internal object called the runtime context (execution context) is created, which defines the environment in which the function executes. Values are copied to the scope chain of the runtime context in the order in which they appear in the function. Together, they form a new object called "active object (activation object)", which contains all the local variables, named parameters, parameter sets, and this of the function, and then the object is pushed to the front of the scope chain, and when the runtime context is destroyed, so does the active object.

The ECMAScript variable may contain values of two different data types: basic type values and reference type values. Basic type values refer to simple segments of data that are stored in stack memory, that is, a location where the value is completely stored in memory. Reference type values refer to objects that hold objects in heap memory, meaning that what is actually stored in a variable is just a pointer to another location in memory where the object is stored.

Five basic data types: Undefined, Null, Boolean, Number and String. The values of these five basic data types occupy a fixed amount of space in memory, so their values can be saved in stack memory.

If a variable is assigned a value of a reference type, space must be allocated for that value in heap memory. Because these values are not fixed in size, they cannot be saved to stack memory. However, the size of the memory address is fixed, so you can save the memory address in stack memory. In this way, when querying variables of reference types, you can first read the memory address from the stack, and then find the values stored in the heap.

Each value stored in stack memory occupies a fixed size of space and can be accessed sequentially. If the stack memory holds the address of a block of memory, the value is like a pointer to the location of the object in the heap memory. Data saved in heap memory is not accessed sequentially because each object does not require equal space.

When you copy a value of a reference type from one variable to another, a copy of the value stored in the stack is also copied into the space allocated for the new variable. The difference is that a copy of this value is actually a pointer to an object stored in the heap. At the end of the copy operation, the two variables actually refer to the same object. Therefore, changing one of the variables affects the other.

The typeof operator is a * * tool for determining whether a variable is a string, numeric value, Boolean value, or undefined basic data type. When detecting the value of a reference type, ECMAScript provides the instanceof operator.

IV. Closure

As long as it is possible to call an internal function, JavaScript needs to keep the referenced function. And the JavaScript runtime needs to keep track of all variables referencing this internal function, and JavaScript's garbage collector won't free up the corresponding memory space until * a variable is obsolete (the red part is the key to understanding closures).

Closures have two uses, one is to read variables within the function, and the other is to keep the values of these variables in memory all the time.

Attention points for using closures

1) because the closure will make the variables in the function be stored in memory, which consumes a lot of memory, the closure should not be abused, otherwise it will cause performance problems of web pages and may lead to memory leakage in IE. The solution is to delete all unused local variables before exiting the function.

2) the closure will change the value of the internal variable of the parent function outside the parent function. So, if you use the parent function as an object (object), the closure as its common method (Public Method), and the internal variable as its private property (private value), you must be careful not to change the value of the internal variable of the parent function.

Some examples of closures:

"how to master js scope chain, memory collection, variables, closures" content is introduced here, thank you for reading. If you want to know more about the industry, you can follow the website, the editor will output more high-quality practical articles for you!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.