What are the benefits of using the keyword "this"?

Question

The following code:

var cody = {
  living:true,
  age:23,
  gender:'male',
  getGender:function(){return cody.gender;} 
};

is the same as :

var cody = {
  living:true,
  age:23,
  gender:'male',
  getGender:function(){return this.gender;} 
};

Both codes acheive the same target. The only difference is the swap of cody with the keyword this. What is the benefits of using the keyword this in Javascript? Does it boost the performance? can we ignore it in OOP?

The `this` keyword in my opinion is complete cosmetic. It makes sense though, and may make your code more understandable. — Shawn31313, Apr 23 '16 at 03:39
this signifies the 'owner' of the attribute, so this.gender and cody.gender are not different aside from the fact that they are different words — Andrew Li, Apr 23 '16 at 03:40
http://stackoverflow.com/questions/3889570/what-is-the-difference-between-this-this-and-this — rmondesilva, Apr 23 '16 at 03:54
Those two examples are not equivalent. They achieve the same result only in some cases, depending on just how you call the function in question. — nnnnnn, Apr 23 '16 at 06:39

score 6 · Answer 1 · edited Apr 23 '16 at 03:51

6

this refers to the current instantiation of the structure in question. For example, the following will fail:

var cody = {
  living:true,
  age:23,
  gender:'male',
  getGender:function(){return cody.gender}
};
var codyCopy = cody;
cody = "foobar";
//undefined
alert(codyCopy.getGender());

However, using this will not, because it correctly refers to the codyCopy:

var cody = {
  living:true,
  age:23,
  gender:'male',
  getGender:function(){return this.gender}
};
var codyCopy = cody;
cody = "foobar";
//male
alert(codyCopy.getGender());

edited Apr 23 '16 at 03:51

Paul

26,170
12
85
119

answered Apr 23 '16 at 03:48

Zatronium

85
6

Thanks a lot for you help. – O'noel Apr 23 '16 at 05:25
`var x = cody.getGender; alert(x());` won't work. (Unless alerting "undefined" counts as working.) The value of `this` depends on how you call the function. – nnnnnn Apr 23 '16 at 06:41
@nnnnnn Yes, that's the point I'm making. The only reason the definition of `this` would change is because the _context_ has changed. In your example you've cached the function belonging to cody, whereas my example caches the entire cody function, including the gender variable. So when we declare that cody is now equal to foobar, the value of `this` hasn't changed, it's just the value referenced by `this.gender` no longer exists. It wasn't cached alongside the `getGender()` call. – Zatronium May 02 '16 at 23:04

score 1 · Accepted Answer · answered Apr 23 '16 at 04:23

1

The 'this' keyword is used to refer to the current execution context or object your code is in. It is useful when you want to define a type of object aka a class for example people:

var Person = function(name, living, age, gender) {
    this.name = name;
    this.living = living;
    this.age = age;
    this.gender = gender;
    this.getGender = function(){return this.gender};
};

var cody = new Person('Cody', true, 23, 'male');
var john = new Person('John', true, 25, 'male');

This allows you to use the 'new' keyword to create multiple unique instances of Person with their own values. So on the line var cody = new Person('Cody', true, 23, 'male'); 'this' refers to the cody var and on the next line it refers to the john var. In your code 'this' refers to your cody var because it is inside the cody object but it is not necessary because you aren't creating new codys with there own values.

answered Apr 23 '16 at 04:23

LukasGuptaLeary

121
4

*"In your code 'this' refers to your cody var because it is inside the cody object"* - No it doesn't. In JS the value of `this` depends on how the function was called, not where the function was defined. – nnnnnn Apr 23 '16 at 06:37
@nnnnnn In his code 'this' is inside an object literal not a function. – LukasGuptaLeary Apr 24 '16 at 02:09
The use of `this` in OP's code *is* in a function. It's inside the function that `getGender` refers to. In any case, my point is that it doesn't matter how the function is *defined*, because the value of `this` is set (either implicitly or explicitly) at the time the function is *called*, and can be set to refer to any object - that is an important feature of how JS functions work. – nnnnnn Apr 24 '16 at 02:24
@nnnnnn Ok your right I was thinking of a standard `cody.getGender()` call but if for example cody was added to a prototype chain or the function was referenced somewhere else `this` would not reference cody. – LukasGuptaLeary Apr 24 '16 at 02:53

What are the benefits of using the keyword "this"?

2 Answers2