oop in javascript! part2:4 pillars of oop

Hi everyone 😃

In the previous article, we started a journey to the oop world by learning prototypes and classes and in this article, we are going to end this journey by exploring 4 pillars of object-oriented programming.
But before we start, what is object-oriented programming?🤔

OOP is a paradigm of programming based on objects (blueprint) that gather related data together and we can instantiate that object and create other objects (instances) and we learned about them in the previous article.

If I want to give an example of an object in the real world, a Car is an object that includes properties like wheels, doors, steering wheel, and methods like moving, stopping, etc… one other example is a person is an object that includes properties and methods like height, weight, skin color, name, age, etc…

1. Encapsulation:
This pillar is about gathering the related data (properties, methods) inside one object So that nothing unrelated can access (read or modify) that data directly.
For example, we have a lot of related data, including start, stop, blowHorn, etc… Which are broadcasted on the global scope and can be accessed by anything, so what we can and should do is to wrap them with an object called Car and that way, something like cow can’t access the blowHorn property! :|(I’m sure you get what I mean and may have better examples in your exploratory minds)

As we can see in the example above, in a bad way, I spread the data in the global scope and anything can just call start or blowHorn and that is not something oop would be happy about.
In a good way (encapsulation), I wrapped these related data with one object called Car so that to tell anyone you are not allowed to use these methods for something like greeting!
In other words, encapsulation is about building a shield to protect related data by preventing them from being directly accessed anywhere and it makes special methods called getter and setter to get and set these data. Of course, I didn’t mention these methods in the above example, so let’s see another example:

In the above example, if I didn’t encapsulate data, they would be accessible anywhere.
By putting them inside Car class, I make them protected and safe. So now I know what these name and speed properties are for and how to set and get them by calling getName and setName, etc…

In the above image, you see an example of a car in the real world. A car is an object that includes wheels, engine, body, and methods like move and shutDown and etc… and we just need to call them.
conclusion: encapsulation redusing the complexity by gathering the related data in one object and protecting the data from being accessed by the outer scope to make them safe.

2.Abstraction
This concept is about hiding unnecessary data and just showing the essentials. It means you don’t need to know how that method works, you just need to know what it does.

In the above picture, that dude doesn’t think about how his machine moves when he presses the accelerator pedal, he just knows by pressing that pedal (by calling move method) the machine is going to move.
code example:

In the above example, we know what the start method does, but we don’t care about how it does it, and that is the abstraction.
One other thing to talk about in the above example is throwing errors in some methods which means you can’t use this method without overriding it for each instance, and also you can’t instantiate the Car object and you just can instantiate its children classes. but why should we override some methods?🤔

well that’s a good question and the answer is :
Imagine we have a method like a start that doesn’t need to be overridden and it is the same in all instances. But if we want to change the start functionality in the Tesla object, we have to change this method from the Car object and this change will impact all other children objects’ start method but we wanted just to change it for Tesla. And that is the reason we override the getPower method for each class child in the above example. Because getPower has a different implementation for each car. Tesla needs electricity but Volvo needs petrol.

conclusion: abstraction shows the essentials and hides the Inessential data in order to reduse the complexity, isolates impact of changes.

3.Inheritance
This concept is about creating a class with a lot of methods and properties to be inherited and used by other classes which have their own special data.

In the above image, we have a Car object that includes properties like door, wheel, and methods like move, stop, blowHorn, etc… and for building different cars we don’t invent the wheel again! Or other methods we mentioned, we just inherit them from the Car object and define other special properties for each car object like color or power, etc…
code example:

In the above example, we have a Car object that includes methods like start and stop. And we have other classes named Tesla and Volvo with special getPower method and inherited methods from Car object to not define them from zero again. Now we can have different models of Tesla and Volvo by instantiating Tesla and Volvo classes.

We didn’t define a start method for each object but when we call it on each instance it knows what to do because it inherited it from the Car object.

conclusion: inheritance prevents duplication methods and occupying more memory space, makes methods reusable and reduses the complexity.

4.Polymorphism
polymorphism consists of two words, poly means ‘many’ and morph means ‘form’ ,thus it means many forms. This concept is about making methods overridable so when we inherit methods, we can override the method which we need, instead of defining a new method and allocating more memory space. In other words, it means the output of our inherited method can have many forms for each object without duplicating them.
If you duplicate the method for each object, in addition to occupying more memory space, decreasing performance and complexity, it ruins the maintainability of the code. So when you want to change that method a little bit, you have to change it in all objects one by one. My fingers get numb even with think of it 😖

In the above image, all cars inherit the steering wheel but with different implementation(different form).
code example:

I don’t think it needs more explanation.

conclusion: polymorphism prevents duplicating methods and memory space occupation by giving methods the capability to be overridden. Causes performance improvement, increases code readability and maintainability, and reduses the complexity.

Well, you may have some questions like what is the difference between abstraction and encapsulation, abstraction and inheritance, etc… So it is understandable to have those questions because they all take advantage of each other. For example, polymorphism uses the inheritance concept.
These questions even may be asked in interviews, and the answer is it doesn’t matter how similar they are to each other. The difference between them is their special way of reaching a common goal.

Encapsulation way: gathering related data in one object and protecting them from being directly accessed by the outer scope.

**Abstract **way: Hide unnecessary data and display essential data to reduce complexity. And isolate the impact of change.

**Inheritance **way: inheriting the methods and properties to make them reusable. And prevent duplication methods and more memory space occupation.

**Polymorphism **way: overriding inherited methods for each object without duplicating methods. And increases performance and code readability and maintainability.

You may have noticed the common goal between those 4 pillars which is reducing complexity and that is object-oriented programming: writing our code simple and reusable and less complex based on objects.
This journey ends up here and I hope you’ve learned oop in javascript once and for all.

Goodbye and Good luck 🤞