What is 'this' in JavaScript

What does 'this' return?

Here's an object which uses this keyword

const man = {
  name: "rick",
  adventure() {
    console.log(this);
  }
};

man.adventure(); 

Executing above you will see the man object on the console.

But what if you do;

const adventure_reference = man.adventure;

adventure_reference();

Output then would be;

Explanation

Value of 'this' is determined by how a function is called;

• If we call a function as a method in an object this will always return a reference to that object.

• If we call a function as a standalone object - or outside an object this will return the global object which is the window object in browsers.

In the next post we will use bind() to solve the problem 'of returning the window object'

Comments

[John Kazer]

Kinda exactly the reason I don't use this. Context dependent behaviour is a nightmare I can do without. A functional style of JavaScript is able to avoid it.

[G1itcher]

I'm sure you already know this, but it's worth saying for any beginners that stumble upon this article.

It's easy to avoid issues with "this" by mandating arrow functions be used either to wrap the required function or just define the functions as arrow functions originally.

Or use bind()

With arrow functions and bind there's not much need to do the old

self = this

solution.

[Naveen Dinushka]

no worries! :)