Home > Web Front-end > JS Tutorial > What is the usage of this in javascript

What is the usage of this in javascript

青灯夜游
Release: 2023-01-05 16:11:33
Original
7399 people have browsed it

Usage of this: 1. In pure function calls, this is used to represent the global object; 2. When the function is called as an object method, this is used to represent the superior object; 3. When called as a constructor, this Used to represent new objects; 4. When apply is called, this is used to represent the first parameter of the apply() function.

What is the usage of this in javascript

The operating environment of this tutorial: windows7 system, javascript version 1.8.5, Dell G3 computer.

This is a keyword in the JavaScript language.

It is an object automatically generated inside the function body when the function is running, and can only be used inside the function body.

function test() {
 this.x = 1;
}
Copy after login

In the above code, when the function test is running, there will automatically be a this object available internally.

So, what is the value of this?

This has different values ​​in different usage scenarios of the function. In general, this is the environment object in which the function runs. 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. Please look at the following code, its running result is 1.

var x = 1;
function test() {
   console.log(this.x);
}
test();  // 1
Copy after login

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.

function test() {
  console.log(this.x);
}
var obj = {};
obj.x = 1;
obj.m = test;
obj.m(); // 1
Copy after login

Case 3 Calling as a constructor

The so-called constructor function is a function through which a new object can be generated. At this time, this refers to this new object.

function test() {
 this.x = 1;
}
var obj = new test();
obj.x // 1
Copy after login

The running result is 1. In order to show that this is not a global object at this time, we make some changes to the code:

var x = 2;
function test() {
  this.x = 1;
}
var obj = new test();
x  // 2
Copy after login

The running 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, and its function is to change the calling object of the function. Its first parameter represents the changed object that calls this function. Therefore, this refers to the first parameter at this time.

var x = 0;
function test() {
 console.log(this.x);
}
var obj = {};
obj.x = 1;
obj.m = test;
obj.m.apply() // 0
Copy after login

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 modify the last line of code to

obj.m.apply(obj); //1
Copy after login

, the running result becomes 1, which proves that this represents the object obj.

[Recommended learning: javascript advanced tutorial]

The above is the detailed content of What is the usage of this in javascript. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template