The execution context of a function is determined by the current operating environment:
1. Global variables and global functions are attached to global objects (Windows), so it is equivalent to use either the "var" or "This" method to define global variables.
2. The execution context and scope are different. The execution context is determined at run time and may change at any time, while the scope is determined at definition and never changes.
3. If you are currently executing a method of an object, the execution context is the object that this method is attached to.
4. If you are currently creating an object or executing a method of an object, the execution context is the object being created.
5. If a method does not explicitly specify a subordinate object at execution time, the context of this method is a global object.
6. Use call and apply to change the execution context of the object.
Look at the following example:
Copy Code code as follows:
var v1 = "global variable"; Global variables are attached to objects
THIS.V1 = "global variable with this"; The global variable is defined with the Var v1 and this.v1 two methods equivalent.
function Func1 () {
var v1 = "part variable";
WriteHTML (v1);
WriteHTML (THIS.V1);
}
Func1 (); Part variable
Global variable
Because there are V1 variables with the same name as the global object in the FUNC1, the V1 referenced in FUNC1 is the variable defined in FUNC1. JavaScript also has local variables to hide the properties of global variables. However, FUNC1 does not explicitly specify a subordinate object, so his execution context is a global object, and a global variable is used to refer to the variable.
Let's look at a slightly more complicated example:
Copy Code code 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 in Ftest are used as global variables. So we use the variable name directly outside the ftest to access the This_v value. However, because the anonymous function returned in ftest is defined within Ftest, the scope of this anonymous function is within Ftest. So when there is a global variable V and a local variable V with the same name, this anonymous function accesses the variable v within the Ftest definition.
Next, take ftest as a class and instantiate it using the New keyword:
Copy Code code 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 not defined
A (); V1v1v1
Undefined
When Ftest is instantiated as an object, the context is the object itself created during the creation of the object. Note that the object created at this time is an instance of Ftest, and a function is returned after the creation completes, which causes the new Ftest () instantiation to return a function instead of the ftest () reference to the object after the instantiation. Therefore, this instantiated object cannot be referenced. When we define this returned function, because the context of this function is not specified with this, the returned function context is the global object, and the scope is internal to the Ftest () function. So when function a () executes, there is no this_v variable defined in the context, resulting in an access error.
Note that the above code:
Copy Code code as follows:
function Ftest () {
return function () {
}
}
Such a form is not a static encapsulation environment, the static encapsulation environment should be: Execute immediately after a function definition completes, and returns an internal function in the function after the execution completes.
Let's look at one of the following examples to see how scopes and contexts affect variable references.
Copy Code code 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 method is defined globally, the scope of method is determined to be global when defined. So when the METHOD2 is called inside the Class1, its scope is global and the context is a global object. Therefore, the variables that are accessed in the function are global variables.
Similarly THIS.METHOD2 is called, its scope is global, however, because the function uses the This keyword to indicate an object whose context is Class1 when it is defined, a global variable is accessed when the function accesses a variable that has no context qualification, and accesses the corresponding variable in the current context when accessing the context-qualified variable Amount
When Method3 and this.method3 are invoked, a local variable is accessed when accessing a variable that has no context qualification, because the local variable hides the global variable. Has the same context as METHOD2, and accesses the variables in the current up and down text.
Use call and apply to change the execution context, because call and apply are just different parameter types, so the examples are shown using call.
Copy Code code 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
As you can see, you can bind a method to a specified context by using call or apply. This point in the global context is a global object.
