JavaScript this in Functions
What is this?
In JavaScript, the this keyword refers to an object.
The this keyword refers to different objects depending on how it is used:
Alone, this refers to the global object. |
In a function, this refers to the global object. |
In a function, in strict mode, this is undefined. |
In an object method, this refers to the object. |
In an event, this refers to the element that received the event. |
Methods like call(), apply(),
and bind() can refer this to any object. |
Note
this is not a variable.
this is a keyword.
You cannot change the value of this.
this Alone
When used alone, this refers to the global object.
Because this is in the global scope.
In a browser window the global object is [object Window]:
In strict mode, when used alone, this also refers to the global object:
this in a Function (Default)
In a function, by default, this is the global object.
In a browser window, the global object is [object Window]:
this in a Function (Strict)
JavaScript strict mode does not allow default binding.
When used in a function, in strict mode, this is undefined.
this in Event Handlers
In HTML event handlers, this refers to the HTML element that received the
event:
This Precedence
Use the following precedence of order to determine which object
this refers to:
| Order | Object | Because |
|---|---|---|
| 1 | bind() | this is in a function being called using bind() |
| 2 | apply() | this is in a function being called using apply() |
| 2 | call() | this is in a function being called using call() |
| 3 | Object method | this is in an object function (method) |
| 4 | Global scope | this is in a function in the global scope |