Inheritance and Subclassing
Tags: beginners, javascript
Published: 2019-12-02 07:40:24

   In programming, inheritance is the process by which an object or class receives methods and properties from another object or class. There are many different ways of accomplishing this across both classical object-oriented programming and JavaScript, but the purpose is basically the same: to give us the ability to reuse code to pass on properties, rather than than having to rewrite and redefine our methods whenever they are needed elsewhere. Subclassing also allows us to create specialist objects by customizing inherited properties from the object's super-class and adding new methods as well.

  Classes work differently in classical object-oriented programming than they do in JavaScript, and if you're a beginner like I am, with no coding experience outside of JavaScript, it can be a little difficult to understand these differences. In languages like Ruby, Java, PHP, Python, C#, C++, and others, classes are a special data-type used to instantiate objects. In stark contrast to JavaScript, Ruby only has one way of creating new objects - by first declaring a class, and then calling the `new()` method on it. This newly created object will inherit most, but not all, of the class's properties. Most noticeably missing from the new object's properties is the `new()` method, which is reserved exclusively for classes.

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/d2tlngrm9mwfjrcijh0t.png)

In JavaScript the rules for creating objects are slightly more relaxed. Pretty much everything in JavaScript is an object, and objects can be created in many ways, including function results and methods. The simplest way to make an object is to just declare it - 
![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/77njvooriqwb8gduu9vt.png)

All objects are instances of `Object` and inherit all properties and methods from the `Object.prototype`. Properties can be inherited via the prototype chain - as exemplified here using the `Object.create()` method - ![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/0oc478631qo1seqws238.png)

Properties and methods can also be passed along in a more familiar way to classical programmers by using the new ES6 `class` keyword and assigning our new class a name - 
![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/h2w6gvfgsp58euo6km6h.png)

Now if we want to build a more specialized object we define a new class that extends the previous class. We can then add new properties and methods to this sub-class while retaining the super-class properties. If we want, we can even alter properties to our new sub-class's needs - 
![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/5luhb2fvsatnq9zydv6i.png)

JavaScript allows us to customize even more by not restricting us to extending only from the super. We can also simply extend a sub-class of another super-class and inherit the properties of both - 
![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/0elwhe082i753cqvb6ou.png)

Although this it similar to creating classes in object-oriented languages, it is really just another way that JavaScript allows us to create objects and pass along methods and properties that will need to be repeated in your code. Unlike in other languages, JavaScript is not restricted to using only this method to produce objects, this gives it more flexibility to make specific changes to code without having to completely rewrite it, which allows us to save space and also reduce time spent searching for bugs in our code.