Detailed explanation of this keyword in js_javascript skills

this is a keyword in the Javascript language.
It represents an internal object automatically generated when the function is running and can only be used inside the function. For example,

Copy code The code is as follows:

　function test(){

　　this.x = 1;

　}

The value of this will change as the function is used. But there is a general principle, that is, this refers to the object that calls the function.

The following is a detailed discussion of the usage of this in four situations.

Scenario 1: Pure function call

This is the most common usage of functions and is a global call, so this represents the global object Global.

Please look at the following code, its running result is 1.

Copy code The code is as follows:

Function test(){

This .x = 1;

　alert(this.x);

　}

test(); // 1

To prove this It is the global object. I made some changes to the code:

Copy the code The code is as follows:

　var x = 1;

function test(){

alert(this.x);

}

test(); // 1

The running result is still 1. Change it again:

Copy code The code is as follows:

　var x = 1;

Function test(){

this.x = 0;

}

test();

alert(x); // 0

Case 2: Calling as an object method

The function can also be called as a method of an object, in which case this refers to the superior object.

Copy code The code is as follows:

function test(){

alert (this.x);

　}

　var o = {};

　o.x = 1;

　o.m = test;

o.m(); // 1

Case three is called as a constructor

The so-called constructor is to generate a new object through this function . At this time, this refers to this new object.

Copy code The code is as follows:

Function test(){

This .x = 1;

　}

　var o = new test();

　alert(o.x); // 1

Run The result is 1. In order to show that this is not a global object at this time, I made some changes to the code:

Copy the code The code is as follows:

var x = 2;

function test(){

this.x = 1;

}

var o = new test ();

　alert(x); //2

The operation result is 2, indicating that the value of global variable x has not changed at all.

Case four apply call

apply() is a method of the function object. Its function is to change the calling object of the function. Its first parameter represents The changed object on which this function is called. Therefore, this refers to the first parameter.

Copy code The code is as follows:

var x = 0;

function test(){

　alert(this.x);

　}

　var o={};

　o.x = 1;

o.m = test;

o.m.apply(); //0

When the parameter of apply() is empty, the global object is called by default. Therefore, the running result at this time is 0, proving that this refers to the global object.

If you change the last line of code to

Copy the codeThe code is as follows:

o.m.apply(o); //1

The running result becomes 1, which proves that this represents object o at this time.