This keyword in avaScript is used to analyze the meaning of this keyword in different situations in a simple way, the cause of this situation, and the method for binding this in JavaScript tools such as Dojo. It can be said that a correct grasp of the this keyword in JavaScript is a step into the threshold of the JavaScript language. This object has always been a pitfall in js, and it is difficult to determine what it actually points to. However, due to the self experience from C ++ or python, this type of error is often made. Next we will detail the ownership of this object.
Rule1: this in the global environment
The javascript environment is naturally determined by the function. In js, context cannot be separated by code blocks. the environment not wrapped by the function is the global environment. this in the global environment points to the global variable window, let's look at the following example.
The Code is as follows:
Var name = 'jjj ';
Console. log (this. name );
// Jjj will be output successfully
Rule2: this used for method calling
Obviously, this situation is well judged. It is consistent with self in python. this undoubtedly points to the object that calls the method.
The Code is as follows:
Var user = {
Name: 'kkk'
};
User. getName = function (){
Console. log (this. name );
};
User. getName ();
// Kkk output
Rule3: this is used as the constructor.
At this time, this does not need to be said. It is clearly directed to the newly created object. the run of the constructor does not actually create an object, but only initialization. The object has been created before it is run.
The following is an example
The Code is 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 has no name attribute
Rule4: this in the indirect call
Indirect call refers to the use of apply and call to call functions. At this time, this points to the first parameter in their parameter list.
The Code is 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
Remember that this will not be changed in other cases. this is also the easiest place to make mistakes.
The Code is as follows:
Var name = "clever coder ";
Var person = {
Name: "foocoder ",
Hello: function (something ){
Var sayhello = function (something ){
Console. log (this. name + "says" + something );
};
Sayhello (something );
}
}
Person. hello ("hello world"); // clever coder says hello world
The above code looks strange. Shouldn't this point to person?
We should remember that this in the nested function does not point to the function of nesting it. In this example, this in sayhello does not point to the function corresponding to hello. If we change the example
The Code is as follows:
Hello: function (something ){
Console. log (this. name + "says" + something );
}
// Foocoder says hello world
As you can see, sayhello is not called as a method at this time, so this points to a global object...
The problem arises. The initial example of running node will show undefined says hello world.
Rule6: eval destroys all rules
End with an example.
The Code is 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 understand?