A brief introduction to Javascript: this_Basic knowledge

activeExecutionContext = {
VO: {... },
this: thisValue};

var myObject = {
value : 0,
increment : function(inc) {
this.value = typeof inc === "number" ? inc : 1;
} }
}
myObject.increment();
console .log(myObject.value); //Output: 1
myObject.increment(3);
console.log(myObject.value); //Output: 4

function showValue(){
console.log( this.value);
}
var a = { value : "a"};
var b = { value : "b"};
a.showValue = showValue;
b .showValue = showValue;
a.showValue(); //Output "a"
b.showValue(); //Output "b"

myObject.double = function(){
var that = this; //Solution
var helper = function(){
console.log(that, ": ", that.value); //Output Object {value: 4, increment: function, double : function} ": " 4
           console.log(this, ": ", this.value); //Output Window {top: Window, window: Window…} ": "                                                                                                                                                 
helper(); //Call
}

in function form

According to the normal thinking, as output in the fourth line, this should point to the object to which the function belongs. However, due to problems in language design, this points to the global object. This makes this even more mysterious and unpredictable. But as developers, this situation is definitely something we don’t want to see. It’s not common sense to play cards. Fortunately, the remedy is also very simple. In the above example, that is used to refer to this. In this way, calling that in the helper method can be used as this, which is simple and convenient. As for the function calling mode, why this behaves like this will be explained in detail later when analyzing the reference type.

Constructor calling mode
Since JavaScript is based on prototypal inheritance, its designers want it to be able to pass new and Constructors create objects, realizing object-oriented programming. This doesn't seem to be a good idea, and it's a bit embarrassing to draw a tiger instead of a dog. One is that it is impossible to learn, but there is no need to learn. JavaScript's prototypal inheritance mechanism is already very powerful, enough to meet the inheritance polymorphism required for object-oriented.

Without further ado, let’s talk about the constructor calling pattern. The constructor calling pattern is very simple. It is to use a function as a constructor, and then use this to introduce the properties and methods you intend to make public. As follows

We can clearly see from the above example that this points to the object created through new and the constructor. Why is this happening? This is because when the constructor is called through new in JavaScript, the new operator calls the internal [[Construct]] method of the "Person" function, and then, after the object is created, the internal [[Call]] method is called. All the same function "Person" sets the value of this to the newly created object.

apply calling mode
After all functions in JavaScript are created, they will have two methods: apply and call. I don’t want to explain the specific use of these two methods in detail here. Students who don’t know can search on Baidu. It’s quite simple. Through two methods, we can set this manually. Although this is not allowed to be modified during creation, if we manually set it before creation, that is another matter. This setting is amazing, you can make your object call any method, just like you can make a car sail in the sea, an African elephant speed like a jaguar, and a programmer play like a pianist. Haha, imagination is always beautiful. Calling is calling, but whether the function can be realized after calling is another matter.

The above looks interesting. The first parameter of apply is the this pointer in the execution method. In this way, we can borrow other people's methods and use them privately and secretly, which is extremely convenient. This type of technique is often used in some frameworks.

Summary
That’s all I have to say about this. I believe that after reading it, everyone will have some understanding of the judgment of this in different situations. I originally planned to discuss the next When discussing reference objects, I will explain the principle of this value in method calling mode and function calling mode. However, I am afraid that the length will be too long, so I decided to use a separate chapter to analyze the concept of reference objects.