# Do we need the keyword "this"?

**URL:** <https://forum.kirupa.com/t/do-we-need-the-keyword-this/646806>\
**Category:** programming\
**Created:** [March 25, 2021, 12:26am UTC](https://forum.kirupa.com/t/do-we-need-the-keyword-this/646806 "2021-03-25T00:26:35Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Belfry777](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/belfry777/32/12917_2.png) [@Belfry777](https://forum.kirupa.com/u/Belfry777)\
**Post date:** [March 25, 2021, 12:26am UTC](https://forum.kirupa.com/t/do-we-need-the-keyword-this/646806/1 "2021-03-25T00:26:35Z")

</div>

Hi,  
As some you know, I am trying to learn JavaScript from the book… In a chapter, there is this example:

```auto
     let person = {
                getName: function () {
                    return "The Name is " + this.firstName + " " + this.lastName;
                },
                getInitials: function () {
                    if (this.firstName && this.lastName) {
                        return this.firstName[0] + this.lastName[0];
     }} };
    let funnyGuy = Object.create(person);
    funnyGuy.firstName = "Conan";
    funnyGuy.lastName = "O'Brien";
    console.log(funnyGuy.firstName);    

```

I am not trying to get out of using the “this” keyword, but it seems as though that it might be easier to simply define the variables (firstName and lastName) at the beginning of the object and re-value them with the new values of the new objects; I think this method is a bit more intuitive. Like:

```auto
    let person2 = {
                firstName: null,
                lastName: null,
                getName: function () {
                    return "The Name is " + this.firstName + " " + this.lastName;
                },
                getInitials: function () {
                    if (this.firstName && this.lastName) {
                        return this.firstName[0] + this.lastName[0];
    } } };
    let funnyGuy2 = Object.create(person2);
    funnyGuy2.firstName = "Ike";
    funnyGuy2.lastName = "777"; 
    console.log(funnyGuy.firstName); // The result is Identical!

```

Is there an advantage to using the “this” keyword that I am not able to appreciate right now?

---

<div class="post-metadata">

**Author:** ![steve.mills](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/steve.mills/32/14961_2.png) [@steve.mills](https://forum.kirupa.com/u/steve.mills)\
**Post date:** [March 25, 2021, 9:47am UTC](https://forum.kirupa.com/t/do-we-need-the-keyword-this/646806/2 "2021-03-25T09:47:05Z")

</div>

I use it like this… 😆  
`NodeList.prototype.xmap = function (fn, ...args) {for (let i = 0; i < this.length; i++) { fn(this[i], ...args)}}`  
Its like an alternate to forEach where the first argument is the function and the second+ the arguments to be run over each item of a nodelist.  
In this case, ‘this’ refers to the nodelist.  
`document.querySelectorAll('button').xmap(someFunc, argument).`  
Don’t do this… 😆, people get funny when you mess with the prototype… it might break their library… 😀

---

<div class="post-metadata">

**Author:** ![steve.mills](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/steve.mills/32/14961_2.png) [@steve.mills](https://forum.kirupa.com/u/steve.mills)\
**Post date:** [March 25, 2021, 10:22am UTC](https://forum.kirupa.com/t/do-we-need-the-keyword-this/646806/3 "2021-03-25T10:22:05Z")

</div>

BTW this is just my opinion but try to never set any value to null.  
If you are yet to assign it another value, just give it an empty version of the type it will be for example person.id = 0; person.name = ‘’. If you forget to reassign it and use it later, it may throw unless you are using nullish coalescing.

---

<div class="post-metadata">

**Author:** ![senocular](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/senocular/32/7217_2.png) [@senocular](https://forum.kirupa.com/u/senocular)\
**Post date:** [March 25, 2021, 10:35am UTC](https://forum.kirupa.com/t/do-we-need-the-keyword-this/646806/4 "2021-03-25T10:35:55Z")

</div>

`this` doesn’t come into play when simply accessing `firstName` and `lastName`. They’re just properties of your object - in fact the same in both cases.

Where it matters is when using `getName()` or `getInitials()`. These methods are what use `this`, and they do so to know where to find and get the values of the `firstName` and `lastName` properties.

```
console.log(funnyGuy.getName()) // The Name is Conan O'Brien
// ^ uses `this` to find values "Conan" and "O'Brien"

```

The value of `this` in `getName()` changes depending on what object is calling it. This is where the real benefit lies.

```
let funnyGuy = Object.create(person);
funnyGuy.firstName = "Conan";
funnyGuy.lastName = "O'Brien";
console.log(funnyGuy.getName()); // The Name is Conan O'Brien

let funnyGuy2 = Object.create(person);
funnyGuy2.firstName = "Ike";
funnyGuy2.lastName = "777"; 
console.log(funnyGuy2.getName()); // The Name is Ike 777

```

Here, there is only one `getName()` function, the one defined in `person` from which both `funnyGuy` and `funnyGuy2` were created. But when this function is called, it knows which names to reference because `this` in that function will be `funnyGuy` or `funnyGuy2` depending on which object made the call.

```javascript
funnyGuy.getName() // <- `this` is funnyGuy
funnyGuy2.getName() // <- `this` is funnyGuy2

```

While this makes `this` very powerful, it can also be very confusing and one of the harder things to wrap your head around in JavaScript, especially as you get into more advanced features and syntaxes which have different rules for it.
