Let's remember a word: this always points to the object where the function is running! Instead of the object where the function was created. Remember...
This article will be divided into three different scenarios to analyze where the this object is.
This in a normal function
No matter where this is, the first priority is to find the location of the function at run time.
Copy Code code as follows:
1 var name= "global";
2 function GetName () {
3 var name= "local";
4 return this.name;
5};
6 alert (GetName ());
When this appears in the function GetName of the global environment, the position of the function GetName at runtime is
Copy Code code as follows:
Obviously, the object of the function GetName is the global object, the window, so the home of this is definitely in window. This point to the Window object, then the GetName returned THIS.name is actually window.name, so alert is "global"!
So where does this not appear in the global environment's function, but in the local environment's function?
Copy Code code as follows:
1 var name= "global";
2 Var twobin={
3 Name: "Local",
4 Getname:function () {
5 return this.name;
6}
7};
8 Alert (Twobin.getname ());
The function in which this body is getname is not in the global environment, but in the twobin environment. Wherever this is located, be sure to find the location of the function at run time. Where the function getname at run time
Copy Code code as follows:
Alert (Twobin.getname ());
Obviously, the function getname is the object of the Twobin, so this is the place of the twobin, that is to point to Twobin object, then GetName returned this.name is actually twobin.name, so alert out is "local"!
This in the closure
Closure is also a restless, this article is not too much to repeat, in short: the so-called closure is to create another function inside a function, and the internal function access to external variables.
The prodigal son this and the ruffian closes the bag to mix together, visible will Yongwuningri Ah!
Copy Code code as follows:
1 var name= "global";
2 Var twobin={
3 Name: "Local",
4 Getname:function () {
5 return function () {
6 return this.name;
7};
8}
9};
Alert (Twobin.getname () ());
This is obviously in a dilemma, in the anonymous function in the GetName function, and the anonymous function calls the variable name, which makes up the closure, that is, the closure of the package.
Wherever this is located, be sure to find the location of the function at run time. It cannot be judged by the position of the function getname the runtime, but by the run-time position of the anonymous function.
Copy Code code as follows:
function () {
return this.name;
};
Obviously, the anonymous function is the object of the window, so this is the home of the window, then the anonymous function returned this.name is actually window.name, so alert out of the "global"!
So how do you make this a twobin in a closure?
Copy Code code as follows:
var name= "global";
var twobin={
Name: "Local",
Getname:function () {
var that=this;
return function () {
return that.name;
};
}
};
Alert (Twobin.getname () ());
Define That=this in the GetName function, at which point the GetName function runs at
Alert (Twobin.getname ());
Then this points to the Twobin object, so that is also pointed to the Twobin object. In the closure of the anonymous function return That.name, then the return of the That.name is actually twobin.name, so you can alert out "local"!
This in call and apply
The estimate of this in JavaScript can be no more than call and apply.
Call and apply are like the parents of this, let this live where it will have to live, have to obey!
Copy Code code as follows:
var name= "global";
var twobin={
Name: "Local",
};
function GetName () {
alert (this.name);
}
GetName (Twobin);
Getname.call (Twobin);
Where this is in the function GetName. Wherever this is located, be sure to find the location of the function at run time. Where the function getname at run time
GetName (Twobin);
Obviously, the function getname is the object of the window, so this is a safe place in the window, that point to the Window object, then GetName return this.name is actually window.name, so alert out of the "global"!
So, the call and apply are on, because this must listen to their command!
Getname.call (Twobin);
In which, call specifies the home of this is in the Twobin object, because this is forced only in Twobin that the home, then this point to Twobin object, THIS.name is actually twobin.name, so alert out is "local"!
A little summary
Prodigal this: Always point to the object at which the function is run, not the object in which the function was created, or if it is in an anonymous function or not in any object, this points to the Window object, or, if it is called or apply, which object it is assigned to!
