DEV Community

Naveen Dinushka
Naveen Dinushka

Posted on • Edited on

12 7

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(); 
Enter fullscreen mode Exit fullscreen mode

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

Alt Text

But what if you do;

const adventure_reference = man.adventure;

adventure_reference();
Enter fullscreen mode Exit fullscreen mode

Output then would be;

Alt Text

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'

Image of Bright Data

Global Data Access Unlocked – Reach data across borders without restrictions.

Unlock the power of global data collection with our advanced proxy solutions. Ideal for market research and more.

Unlock Data Now

Top comments (3)

Collapse
 
johnkazer profile image
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.

Collapse
 
g1itcher profile image
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.

Collapse
 
naveenkolambage profile image
Naveen Dinushka

no worries! :)

👋 Kindness is contagious

Engage with a sea of insights in this enlightening article, highly esteemed within the encouraging DEV Community. Programmers of every skill level are invited to participate and enrich our shared knowledge.

A simple "thank you" can uplift someone's spirits. Express your appreciation in the comments section!

On DEV, sharing knowledge smooths our journey and strengthens our community bonds. Found this useful? A brief thank you to the author can mean a lot.

Okay