JS how to avoid using "this"

Question

I recently watched a youtube tutorial, and the guy did something interesting in the series (it's node.js game tutorials by Raining Chain). His constructor looks like this:

const MakeStuff = function(param1, param2) {
  const self = {};
  self._param1 = param1;
  self._param2 = param2;
  // and so on...
  return self;
}

const someStuff = MakeStuff(param1, param2);

I then checked google for what "self" meant and it found out it's something similar to "this"... It's really confusing me now. At first I thought he's just naming it "self" to mimic "this", but avoid using it.

Also, JSLint really hates "this", and I hate to dumb down JSLint and disable or edit options (ocd), so I'm trying to figure out how am I gonna use classes, and avoid using "this" inside classes constructor.

I figured I'd copy/paste my class function in babeljs and see what the class syntax actually does under the hood, but I got even more confused.

I have around 2k lines of code in my game, and 1.5k are just classes with getters, setters and static methods.

What does the code above actually do? What does self mean? Can I use JS classes and avoid using "this" in constructors? Why does JSLint even hate "this"? Should I rework my code using the example above and bind getters, setters and static methods using prototype?

Thanks!

In this instance, `self` is just a variable that's initially assigned as a blank Object, and then has a few fields attached to it before being returned. There's nothing _special_ about calling it `self` instead of `thing` or `mine` or any other name. Within the scope of the function, it is just a label, and when you return it, it just becomes what ever you assigned it to (`someStuff` in this case). — g.d.d.c, May 23 '18 at 16:59
This may be helpful: https://stackoverflow.com/questions/16875767/difference-between-this-and-self-in-javascript — Jeremy Dentel, May 23 '18 at 17:00

Firephp · Answer 1 · 2018-05-23T17:17:45.337

As of now, self is used by other languages in place of js' this; it is a reference to the instance's context. In this use case, he's not writing a constructor, but a factory. self is little more than a naming convention here. It would make no difference if he wrote:

const MakeStuff = function(param1, param2) {
  const obj = {};
  obj._param1 = param1;
  obj._param2 = param2;
  // and so on...
  return obj;
}

const someStuff = MakeStuff(param1, param2);

Also, +1 to brk for mentioning that self, unless re-set, references window.

score 1 · Answer 2 · answered May 23 '18 at 17:05

What does the code above actually do?

const MakeStuff = function(param1, param2) {
  const self = {};
  console.log(self);
  self._param1 = param1;
  self._param2 = param2;
  // and so on...
  return self;
}

const someStuff = MakeStuff(1, 2);
console.log(someStuff)

This above code simply calls a function which accepts two parameter and return an object.self inside this function is merely a variable

What does self mean?

Unless specifically set self refers to the window object.But in the above function const self is not window.self

console.log(self)

score 0 · Answer 3 · edited Jun 20 '20 at 09:12

To me MakeStuff is just a function, not a constructor. And self doesn't have anything to do with this in the code you provided. Here it's just a variable inside the function that gets assigned some keys and elements param1 and param2.

const MakeStuff = function(param1, param2) {
  const returnedElement = {};
  returnedElement ._param1 = param1;
  returnedElement ._param2 = param2;
  // and so on...
  return returnedElement ;
}

const someStuff = MakeStuff(param1, param2);

Sometimes you will need to use self (some use that) to access this but within another scope.

A great explanation you can find on another SO thread is:

var self = this;

[This is] keeping a reference to the current object, so later when you call [self] you're calling that method on that object, not any other.

score 0 · Answer 4 · answered May 23 '18 at 16:59

0

in your case self is just the name of an constant.

answered May 23 '18 at 16:59

schildi

136
7

score 0 · Accepted Answer · edited Jun 20 '20 at 09:12

this is one of the important aspects of JavaScript but one of the most poorly understood. It is absolutely essential to understand to do any Object Oriented Programming within JS which is essential to game design.

I would recommend learning about scope and how this applies to different things in different scopes.

Essentially when you run a function such as

function window_scope() {

this.foobar;

}

this is the window in browsers or whatever variable is defined as the global scope. Meaning this.foobar is equal to window.foobar

When you do new while calling a function such as var newfoo = new foo()

function foo() {

this.foobar;

}

this has suddenly become a reference to newfoo. Meaning this.foobar is equal to newfoo.foobar This allows you to make objects that don't need a reference to the actual local variable newfoo

Very useful links provided. I couldn't decide which one to pick as an answer as they are all equally good answers. Thanks everybody for helping out. — , May 23 '18 at 17:28

JS how to avoid using "this"

5 Answers5