3 Weird JavaScript Class Tricks That Could Be Useful

Photo by Nick Fewings on Unsplash

I love experimenting with stuff and JavaScript has a lot of weird and hidden gems that are always fun to learn about. Some are just holes in the API and others are intentional or happy accidents. Either way, with the right problem and the right needs, these can be very useful to exploit.

1 — Returning an object from the constructor (singleton)

It is super weird for a constructor to return something else other than the instance of the class it belongs to. Well, in JavaScript this can actually be done.

Let’s take an example of a simple car class.

class Car {
  make = '';
  model = '';
  doorsCount = 4;
  wheelsCount = 4;
  
  constructor(make, model) {
    this.make = make;
    this.model = model;
  }
}

By default, new Car(...) will return an instance object of a class which we can use to access the properties and methods of the class.

const jeepWrangler = new Car('jeep', 'wrangler');
jeepWrangler.doorsCount = 2;
jeepWrangler.model; // wrangler

We can actually return something from the constructor, for example, a different object.

class Car {
  make = '';
  model = '';
  doorsCount = 4;
  wheelsCount = 4;
  
  constructor(make, model) {
    this.make = make;
    this.model = model;
    
    return {
      different: true
    }
  }
}

This simply means that when we instantiate the class, we get the returned object.

const jeepWrangler = new Car('jeep', 'wrangler');
jeepWrangler.model; // undefined
jeepWrangler.different; // true

But this only has this effect if you return an object. If you return a primitive, the class works as normal.

class Car {
  make = '';
  model = '';
  doorsCount = 4;
  wheelsCount = 4;
  
  constructor(make, model) {
    this.make = make;
    this.model = model;
    
    return 12
  }
}
const jeepWrangler = new Car('jeep', 'wrangler');
jeepWrangler.model; // wrangler

So, what can you exploit this weirdness for?