# ''this'' in stand alone function

**URL:** <https://forum.codewithmosh.com/t/this-in-stand-alone-function/7695>\
**Category:** React\
**Created:** [October 2, 2021, 10:59am UTC](https://forum.codewithmosh.com/t/this-in-stand-alone-function/7695 "2021-10-02T10:59:25Z")\
**Posts on this page:** 1\
**Showing post:** 2

<div class="post-metadata">

**Author:** ![eelsholz](https://avatars.discourse-cdn.com/v4/letter/e/439d5e/32.png) [@eelsholz](https://forum.codewithmosh.com/u/eelsholz)\
**Post date:** [October 17, 2021, 11:53am UTC](https://forum.codewithmosh.com/t/this-in-stand-alone-function/7695/2 "2021-10-17T11:53:50Z")

</div>

When the `render` function is called, it has the correct `this`. So when it calls `this.getBadgeColor()` and `this.formatCount()`, those functions also have the correct `this` and everything works as expected. But notice that the `render` function isn’t calling `this.handleIncrement`, if it were you would see parentheses like `this.handleIncrement()`. Rather, it’s passing the `handleIncrement` function over to the `onClick` event to be called later. When you pass functions around, the `this` doesn’t automatically go along with the function, unless you do something to bind it to the function. For example in the constructor you could

```auto
this.handleIncrement = this.handleIncrement.bind(this);

```

which creates a new version of the `handleIncrement` function that always has the correct `this`.

More details [here](https://reactjs.org/docs/handling-events.html).

---

_[View the full topic](https://forum.codewithmosh.com/t/this-in-stand-alone-function/7695)._