# this

## this

Refers to the **current context**

Its value depends on **how the function is called**

## How does it work?

The following rules are applied:

1. If the `new` keyword is used when calling the function, `this` inside the function is a brand new object.
2. If `apply`, `call`, or `bind` are used to call/create a function, `this` inside the function is the object that is passed in as the argument.
3. If a function is called as a method, such as `obj.method()` — `this` is the object that the function is a property of.
4. If a function is invoked as a free function invocation, meaning it was invoked without any of the conditions present above, `this` is the global object. In a browser, it is the `window` object. If in strict mode (`'use strict'`), `this` will be `undefined` instead of the global object.
5. If multiple of the above rules apply, the rule that is higher wins and will set the `this` value.
6. If the function is an ES2015 arrow function, it ignores all the rules above and receives the `this` value of its surrounding scope at the time it is created.

For an in-depth explanation, do check out his [article on Medium](https://codeburst.io/the-simple-rules-to-this-in-javascript-35d97f31bde3).

**References**

* [https://codeburst.io/the-simple-rules-to-this-in-javascript-35d97f31bde3](https://codeburst.io/the-simple-rules-to-this-in-javascript-35d97f31bde3)
* [https://stackoverflow.com/a/3127440/1751946](https://stackoverflow.com/a/3127440/1751946)

### Examples

What is the result of the following code?

```javascript
var fullname = 'John Doe';
var obj = {
   fullname: 'Colin Ihrig',
   prop: {
      fullname: 'Aurelio De Rosa',
      getFullname: function() {
         return this.fullname;
      }
   }
};

console.log(obj.prop.getFullname());

var test = obj.prop.getFullname;
console.log(test());
```

#### Answer:

```javascript
Aurelio De Rosa
John Doe
```

In `console.log(obj.prop.getFullname());` `getFullname()` is invoked as a function of the `obj.prop` object. So, the context refers to the latter and the function returns the `fullname` property of this object.

In `var test = obj.prop.getFullname;`the context refers to the global object (`window`). This happens because `test` is implicitly set as a property of the global object. For this reason, the function returns the value of a property called `fullname` of `window`, which in this case is the one the code set in the first line of the snippet.
