New, Inheritance, and Pseudoclassical Instantiation

The new operator is an expeditious little line of code in JavaScript. A part of pseudoclassical instantiation, new is a concise and speedy tool for optimized object creation.

MDN explains that the new operator “lets developers create an instance of a user-defined object type or of one of the built-in object types that has a constructor function.” If you’re able to get past the slightly broken metaphor, I find it helpful to imagine new as a microwave (of sorts). It allows you to heat up a bit of code quickly and en masse.

Under the hood, our new keyword does the following (again from MDN):

1. Creates a blank, plain JavaScript object.
2. Adds a property to the new object (__proto__) that links to the constructor function’s prototype object

Properties/ objects added to the construction function prototype are therefor accessible to all instances created from the constructor function (using new).

1. Binds the newly created object instance as the this context (i.e. all references to this in the constructor function now refer to the object created in the first step).
2. Returns this if the function doesn’t return an object.

Okay, so, there are a couple things to unpack. What exactly is pseudoclassical instantiation? This may feel like any other novel learning moment in JS if this is your first programming language (it’s mine), but the roots of class-driven inheritance are actually poached from other object-oriented languages (like Java for instance).

Pseudoclassical Instantiation has two powerful tools at its disposal: this and new. So, let’s go back to that second bullet point from MDN: The this code will allow a developer to set properties to the new object that links to the constructor function’s prototype object.

Let’s see what we can do in google Chrome’s DevTools:

Above, we’ve created a simple little popcorn function that takes in three parameters: type, size, and a Boolean for “with MnMs”.

Now that we have our constructor function built out, we can begin compiling new objects to link to our prototype.

Here we can see new instances of our function being called to quickly and efficiently create three objects (kernel1, kernel2, and kernel3).

On the surface, this may seem relatively minor, but imagine you’re taking the orders of a parking lot full of eager drive-in movie goers. By utilizing new you are conserving time and space by allowing numerous objects to inherit their prototype function. When scaling for size, this could prove immensely helpful.

This level of inheritance is all made possible by the object’s prototype chain. When accessing properties of an object, JS will know not only to look in the current object, but also all prototype objects. This property search is one of programming heredity.

If the current object doesn’t hold that property, it will move up the chain one generation and search there and it will continue that search until it finds the property in question or it reaches the end of the line at the great global object in the sky. This is because functions inherently carry the prototype property.

It can sometimes feel overwhelming trying to parse together language like inheritance, pseudoclassical instantiation, constructor function, popcorn, etc.… but I think MDN clarifies very succinctly: when you utilize (and you will) new, all that you are doing is returning an object that is an instance of that prototype function. The large bag of kettle corn is only a single instance of our function popcorn.