Classical vs. Prototypal Inheritance
Tags: objectorientation, javascript, classes, beginners
Published: 2019-03-25 20:18:58

---
title: Classical vs. Prototypal Inheritance
published: true
description: Object-Oriented Programming & Inheritance
tags: objectorientation, javascript, classes, beginner
---

[Stay hydrated out there](https://amzn.to/3S26cJa)

![Shoe Class Example](https://thepracticaldev.s3.amazonaws.com/i/x2cnpuc75xtagtsewv58.jpg)

#Object Orientation

Objects are abstractions (or described representations) of physical things with which we interact in the real world. Some real-world things are much more alike than others. A boot, for example, has much more in common with a slipper than it does with a tree. It wouldn't be out of the ordinary to refer to either as a Shoe. Without hardly knowing it, we make these mental organizations all the time.

The purpose of Object-Oriented Programming is to mimic these real-world categories as closely as possible. As important as it is to recognize the similarities between objects, we must also realize their differences. Let's take our Shoe example a step farther.

Let's discuss what properties and behaviors shoes have in common: a size, a color, and a material. We can change a shoe's color or a shoe can wear down.

![Shoe Class Example](https://thepracticaldev.s3.amazonaws.com/i/7d7mr4akogxd6y8ykzax.png)

Just as we do in reality we can categorize all Shoes by what they have in common, and create an endless amount of individual Shoe copies that inherit all the characteristics that all shoes have, but with their own unique characteristics as well. 

In this case Shoe is known as a **Generalization**; in other words the more general, less specific description of a real-world item.

![Shoe Class Example](https://thepracticaldev.s3.amazonaws.com/i/xk9wfua4hst9ysug7lo7.png)

#Classical Inheritance

In Classical Inheritance, Objects are still abstractions of real world 'things', but we can only refer to Objects through *Classes*. Classes are a *Generalization of an object*. In other words, Classes are an abstraction of an object of a real world thing. (Classes, then, are an abstraction of an abstraction of a real-world thing). Since a Class is yet another reference to (or abstraction of) its predecessor, each descendant child Class increases the level of abstraction, thus increasing the level of generalization.  

![Shoe Class Example](https://thepracticaldev.s3.amazonaws.com/i/85jjh434am5tuwvz7cq2.png)

#Prototypal Inheritance

As opposed to Classical Inheritance, Prototypal Inheritance does not deal with increasing layers of abstraction. An Object is either an abstraction of a real-world thing, same as before, *or* is a direct copy of another Object (in other words, a **Prototype**). Objects can be created from thin air, or they can be created from other objects:

![Shoe Class Example](https://thepracticaldev.s3.amazonaws.com/i/ip4abxoh3v36ofjnv6oi.png)

This is important! It means that Generalizations (like the overarching Shoe concept) are just other Objects. With Classical Inheritance, Generalizations are abstractions of abstractions of abstractions... all the way down to the most recent descendant. 

The abstraction level here is never deeper than 1; *The only abstraction that occurs with Prototypal Inheritance is the abstraction away from real-world things*. 

Prototypal Inheritance includes some [key advantages over Classical Inheritance:](http://aaditmshah.github.io/why-prototypal-inheritance-matters/)

![Shoe Class Example](https://thepracticaldev.s3.amazonaws.com/i/ii4vwgaxg6jyt8e19zpd.png)

#The Mechanics of Prototypal Inheritance

##The Constructor

In JavaScript, all Objects have a Constructor. And in JavaScript classes, we use the Constructor function to create and instantiate new Objects within a class. Each class can only have one constructor. In the example above, we instantiate each Shoe Object with characteristics that all Shoe Objects share (all Shoes have a size, color, and material). 

You can take a more in-depth look into Constructors (how to view an Object's class, how to change a class, etc.) on [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/constructor).


##New Operator

According to [MDN docs](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/new) the New operator performs the following actions:

1. Creates a blank, plain JavaScript object;
2. Links (sets the constructor of) this object to another object;
3. Passes the newly created object from Step 1 as the this context;
4. Returns this if the function doesn't return its own object.

In order to instantiate a Prototype of a JS class, we use the keyword `new`. In the example above, we define the name of the new Object `let slipper` and create it with `new`. We then pass in the parameters defined in the constructor of the Shoe class. These new Object instantiations are known as *types*. You can then access any of the Object properties by calling, for example, `slipper.size` or `slipper.color`.

![Shoe Class Example](https://thepracticaldev.s3.amazonaws.com/i/9p7y2lxu0lfb7q9vf0a8.png)

#Conclusion

The differences between Classical and Prototypical Inheritance can get pretty complex quickly. If you wish to study these concepts on a much deeper level, you might try ["Why Prototypical Inheritance Matters"](http://aaditmshah.github.io/why-prototypal-inheritance-matters/) by Aadit M Shah.

[Stay hydrated out there](https://amzn.to/3S26cJa)

#I hope this was helpful

But you know what else is helpful... [A shiny new mechanical keyboard](https://amzn.to/48GVlcT). 
Click that if you're interested in a good one. 

Or click this for [another cool option](https://amzn.to/48lQTRe).

Or perhaps you have a good one and you want to [spruce it up a bit](https://amzn.to/3RMztpK) (you know I did).