This in JavaScript _javascript tips

This object is always a pit in JS, it's hard to tell what it's pointing to, and we often make this kind of mistake because of the experience of self from C + + or Python. Next, let's talk about the ownership of this object in detail.

Rule1: This for the global environment

JavaScript environment is naturally determined by the function, in JS can not be separated by the code block context, the function is not wrapped by the environment is the global environment, the global environment, this point to the global variable window, see the following example

Copy Code code as follows:

var name= ' JJJ ';
Console.log (this.name);
Will successfully output JJJ

Rule2: This in the case of a method call

Obviously this is a good judgment, consistent with self in Python, this is no doubt pointing to the object calling the method

Copy Code code as follows:

var user={
Name: ' KKK '
};
User.getname=function () {
Console.log (this.name);
};
User.getname ();
Will output KKK

Rule3: This when the constructor functions

This also does not need me to say, obviously point to the newly created object, the constructor does not actually create the object, but only initialize, the object was created before running
Here are some examples to illustrate

Copy Code code as follows:

function User (name) {
This.name=name;
}
var f1=new User (' KKK ');
var f2=user (' KKK ');
Console.log (f1.name);//kkk
Console.log (f2.name);//undefined does not have a Name property

Rule4: This in an indirect call

The so-called indirect invocation refers to using apply and call to invoke a function, at which point this points to the first argument in their argument list.

Copy Code code as follows:

var setname=function (name) {
This.name=name;
};
var user={level:2};
User.apply (SetName, ' jjj ');
Console.log (user.name);//jjj

Rule5: This in other cases

Keep in mind that this will not be changed in other circumstances and that this is the easiest place to make mistakes.

Copy Code code as follows:

var name = "Clever coder";
var person = {
Name: "Foocoder",
Hello:function (STH) {
var SayHello = function (sth) {
Console.log (this.name + "says" + sth);
};
SayHello (STH);
}
}
Person.hello ("Hello World");//clever coder says Hello World

The code above looks strange, isn't this supposed to point to person?
We should remember that this in the nested function does not point to the nested function, in which case this does not point to the function of the hello corresponding to the SayHello. If we change the example a little bit into

Copy Code code as follows:

Hello:function (STH) {
Console.log (this.name + "says" + sth);
}
Foocoder says Hello World

Everyone should have seen that this time, SayHello is not being invoked as a method, so this is pointing to the global object ...
When the problem comes up, running the initial example with node will show undefined says Hello world, not knowing if there is a great God to explain.

Rule6:eval destroy all the rules.

Finally end with an example

Copy Code code as follows:

var name = "Clever coder";
var user={
Name: ' KKK '
};
User.getname=function () {
Console.log (this.name);
};
var get=user.getname;
Get ();//clever coder

Do you get it?