This and execution context implementation code

The execution context of the function depends on the current running environment:
1. Global variables and global functions are attached to global objects (Windows). Therefore, using "var" or "this" is equivalent to defining global variables.
2. The execution context and scope are different. The execution context is determined at runtime and may change at any time, while the scope is determined at definition and will never change.
3. If the method of an object is currently executed, the execution context is the object attached to this method.
4. If the execution is an object creation process or an object method, the execution context is the object being created.
5. If a method does not explicitly specify a secondary object during execution, the context of this method is a global object.
6. call and apply can be used to change the execution context of an object.
See the following example:
Copy codeThe Code is as follows:
Var v1 = "global variable"; // global variables attached to objects
// This. v1 = "global variable with this"; // use var v1 and this. v1 to define global variables.
Function func1 (){
Var v1 = "part variable ";
WriteHtml (v1 );
WriteHtml (this. v1 );
}
Func1 (); // part variable
// Global variable

Because func1 has v1 variables with the same name as the global object, func1 directly references the variables defined in func1. Javascript also has the feature that local variables hide global variables. However, func1 does not explicitly specify the secondary object. Therefore, its execution context is a global object, and the global variable that uses this to reference the variable is a global variable.
Let's look at a slightly more complex example:
Copy codeThe Code is as follows:
Function ftest (){
Var v = "v1v1v1 ";
This. this_v = "this_v ";
Return function (){
WriteHtml (v );
WriteHtml (this. this_v );
}
}
Var a = ftest ();
Var v = "v2v2v2 ";
WriteHtml (this_v); // this_v
A (); // v1v1v1
// This_v

When ftest is executed as a function, the context is a global object. Therefore, the variables defined by this in ftest become global variables. Therefore, we directly use the variable name to access the value of this_v outside ftest. However, since the returned anonymous function in ftest is defined within ftest, the scope of this anonymous function is within ftest. Therefore, when a global variable v has the same name as a local variable v, this anonymous function accesses the variable v defined in ftest.
Next, use ftest as a class and use the new keyword to instantiate it:
Copy codeThe Code is as follows:
Function ftest (){
Var v = "v1v1v1 ";
This. this_v = "this_v ";
Return function (){
WriteHtml (v );
WriteHtml (this. this_v );
}
}
Var a = new ftest ();
Var v = "v2v2v2 ";
// WriteHtml (this_v); // error: this_v undefined
A (); // v1v1v1
// Undefined

When ftest is used as an object for instantiation, the context of the object itself is created during object creation. Note that the object created at this time is the ftest instance, and a function is returned after the creation is complete, which leads to a function returned after the new ftest () is instantiated, instead of ftest () reference of the object after instantiation. Therefore, the instantiated object cannot be referenced. When we define the returned function, because this does not specify the context of the function, the context of the returned function is a global object and the scope is inside the ftest () function. Therefore, when function a () is executed, an access error occurs because the this_v variable is not defined in the context.
Note: The above code:
Copy codeThe Code is as follows:
Function ftest (){
Return function (){
}
}

This form is not a static encapsulation environment. The static encapsulation environment should be: Execute immediately after a function is defined, and return an internal function in the function after the execution is completed.
Let's take a look at the following example to observe the impact of the scope and context on variable reference.
Copy codeThe Code is as follows:
Var v = "global variable ";
Function method (){
WriteHtml (v );
WriteHtml (this. v );
}
Var Class1 = function (){
Var v = "private variable ";
This. v = "object variable ";

Var method2 = method;
This. method2 = method;

Var method3 = function (){
WriteHtml (v );
WriteHtml (this. v );
}
This. method3 = function (){
WriteHtml (v );
WriteHtml (this. v );
}

Method2 (); // global variable
// Global variable
This. method2 (); // global variable
// Object variable
Method3 (); // private variable
// Global variable
This. method3 (); // private variable
// Object variable
}
Var obj = new Class1 ();


Because the method is defined globally, the scope of the method is determined to be global when it is defined. Therefore, when method2 is called inside Class1, its scope and scope are global, and the context is a global object. Therefore, all the variables accessed in the function are global variables.
Similarly, this. when method2 is called, its scope is global, but because this keyword is used to specify the object whose context is Class1 during definition, therefore, when a function accesses a variable without a context limitation, it accesses a global variable. When a variable with a context limitation is accessed, It accesses the corresponding variable in the current context.
When you call method3 and this. method3, local variables are accessed when you access variables without context restrictions, because local variables hide global variables. If the context is the same as that in method2, variables in the current context are accessed.
Call and apply can be used to change the execution context. Because call and apply are only of different parameter types, call is used for demonstration in the following example.
Copy codeThe Code is as follows:
Var v = "global variable ";
Var method = function (){
WriteHtml (this. v );
}
Var Class2 = function (){
This. v = "object variable in instance of Class2 ";
This. method = function (){
WriteHtml (this. v );
}
}
Var Class3 = function (){
This. v = "object variable in instance of Class3 ";
This. method = function (){
WriteHtml (this. v );
}
}

Var obj2 = new Class2 ();
Var obj3 = new Class3 ();

Method (); // global variable
Obj2.method (); // object variable in instance of Class2
Obj3.method (); // object variable in instance of Class3

Method. call (obj2); // object variable in instance of Class2
Method. call (obj3); // object variable in instance of Class3
Obj2.method. call (obj3); // object variable in instance of Class3
Obj2.method. call (this); // global variable
Obj3.method. call (obj2); // object variable in instance of Class2
Obj3.method. call (this); // global variable


You can see that the call or apply method can be bound to the specified context. In the global environment, the context that this points to is a global object.