---
title: Javascript this Keyword
description: "### Example `var person = { firstName: \"John\", lastName : \"Doe\", id : 5566, fullName : function() { return this.firstName + \" \" + this.lastName; } };` ## What is **this**? The JavaScript `this` keyword refers to the object it belongs to. It…"
url: "https://apprentice.mn/docs/javascript-this-keyword/"
updated: "2021-05-18"
category: Javascript
---

# Javascript this Keyword

### Example

     `var person = {
  firstName: "John",
  lastName : "Doe",
  id       : 5566,
  fullName : function() {
    return this.firstName + " " + this.lastName;
  }
};`

## What is **this**?

The JavaScript `this` keyword refers to the object it belongs to.

It has different values depending on where it is used:

- In a method, `this` refers to the **owner object**.
- 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 event, `this` refers to the **element** that received the event.
- Methods like `call()`, and `apply()` can refer `this` to **any object**.

---

## **this** in a Method

In an object method, `this` refers to the “**owner**” of the method.

In the example on the top of this page, `this` refers to the **person** object.

The **person** object is the **owner** of the **fullName** method.

     `fullName : function() {
  return this.firstName + " " + this.lastName;
}`

## **this** Alone

When used alone, the **owner** is the Global object, so `this` refers to the Global object.

In a browser window the Global object is `[object Window]`:

### Example

      `var x = this;`

 In **strict mode**, when used alone, `this` also refers to the Global object `[object Window]`:

### Example

      `"use strict";
var x = this;`

## **this** in a Function (Default)

In a JavaScript function, the owner of the function is the **default** binding for `this`.

So, in a function, `this` refers to the Global object `[object Window]`.

### Example

      `function myFunction() {
  return this;
}`

## **this** in a Function (Strict)

JavaScript **strict mode** does not allow default binding.

So, when used in a function, in strict mode, `this` is `undefined`.

### Example

      `"use strict";
function myFunction() {
  return this;
}`

## **this** in Event Handlers

In HTML event handlers, `this` refers to the HTML element that received the event:

### Example

      `<button onclick="this.style.display='none'">
  Click to Remove Me!
</button>`

## Object Method Binding

In these examples, `this` is the **person** object (The person object is the “owner” of the function):

### Example

      `var person = {
  firstName  : "John",
  lastName   : "Doe",
  id         : 5566,
  myFunction : function() {
    return this;
  }
};`

### Example

     `var person = {
  firstName: "John",
  lastName : "Doe",
  id       : 5566,
  fullName : function() {
    return this.firstName + " " + this.lastName;
  }
};`

In other words: **this.firstName** means the **firstName** property of **this** (person) object.

---

## Explicit Function Binding

The `call()` and `apply()` methods are predefined JavaScript methods.

They can both be used to call an object method with another object as argument.

You can read more about `call()` and `apply()` later in this tutorial.

In the example below, when calling person1.fullName with person2 as argument, `this` will refer to person2, even if it is a method of person1:

### Example

      `var person1 = {
  fullName: function() {
    return this.firstName + " " + this.lastName;
  }
}
var person2 = {
  firstName:"John",
  lastName: "Doe",
}
person1.fullName.call(person2);  // Will return "John Doe"`        [https://www.addtoany.com/add_to/facebook?linkurl=https%3A%2F%2Fapprentice.mn%2Fdocs%2Fjavascript-this-keyword%2F&linkname=Javascript%20this%20Keyword](https://www.addtoany.com/add_to/facebook?linkurl=https%3A%2F%2Fapprentice.mn%2Fdocs%2Fjavascript-this-keyword%2F&linkname=Javascript%20this%20Keyword)[https://www.addtoany.com/add_to/mastodon?linkurl=https%3A%2F%2Fapprentice.mn%2Fdocs%2Fjavascript-this-keyword%2F&linkname=Javascript%20this%20Keyword](https://www.addtoany.com/add_to/mastodon?linkurl=https%3A%2F%2Fapprentice.mn%2Fdocs%2Fjavascript-this-keyword%2F&linkname=Javascript%20this%20Keyword)[https://www.addtoany.com/add_to/email?linkurl=https%3A%2F%2Fapprentice.mn%2Fdocs%2Fjavascript-this-keyword%2F&linkname=Javascript%20this%20Keyword](https://www.addtoany.com/add_to/email?linkurl=https%3A%2F%2Fapprentice.mn%2Fdocs%2Fjavascript-this-keyword%2F&linkname=Javascript%20this%20Keyword)[https://www.addtoany.com/share](https://www.addtoany.com/share)