Object Oriented Programming (OOP): PART 1

In this article, we will delve deep into one of the most important programming paradigms used whenever it requires a large scalability called Object Oriented programming (OOP).

This article will be basically divided into two Parts:

1. Objects and Classes

2. Four Pillars of OOP

PART 1: Objects and Classes

Before moving forward, Let us Discuss

What is object-oriented programming (OOP) ?

• OOP is a programming paradigm that believes in grouping data (properties) and methods (actions) together inside a box. It demonstrates the pattern of real-world objects.

• OOP is very useful on large-scale projects, as it facilitates code modularity and organization.

• As we know that there are most of the programming languages that support OOP paradigms such as Java, C++, Python and JavaScript.

Let us now forward in better understanding the OOP by dwelling on the core concepts with a much more particle example.

In OOP Entities are coded as objects and each entity will have a group of "information" called "properties" and an "action" called "methods" that can be performed by the entity.

How to Create Objects and Classes?

For the reference,we are going to take a practical example with a different character of SuperHeroes from Marvel and DC and their Enemy,so fasten your seatbelt

say we want to create 6 different superheroes from 2 of each community, A way of creating our characters could be to just manually create the objects using object literals, in this way,

const marvel_1 = {
    name: "Iron Man",
    member: "Avengers",
    sayPhrase: () => console.log("I'm Iron Man!"),
    canFly: () => console.log("ssssssssssssshhhhhhhhhhh!!")
}
const marvel_2 = {
    name: "Thor",
    member: "Avengers",
    sayPhrase: () => console.log("I'm still worthy"),
    canFly: () => console.log("ssssssssssssshhhhhhhhhhh!!")
}
const dc_1 = {
    name: "Batman",
    member: "Justice League",
    sayPhrase: () => console.log("I am Batman!"),
    hide: () => console.log("Catch me if you can!")
}
const dc_2 = {
    name: "Aquaman",
    member: "Justice League",
    sayPhrase: () => console.log("Tide is calling!"),
    hide: () => console.log("Catch me if you can!")
}
const xmen_1 = {
    name: "Wolverine",
    member: "X-Men",
    sayPhrase: () => console.log("So... This Is What It Feels Like!"),
    isMutant: () => console.log("yes")
}
const xmen_2 = {
    name: "Pheonix",
    member: "X-men",
    sayPhrase: () => console.log("I am Jean Grey!"),
    isMutant: () => console.log("yes")
}

from the above code representation, we can see that each character has the name and member as "Properties" and sayPhrase as "methods". But each member has one method that is different from other members ( for e.g. member of Marvel has the ability of the canfly() method).

As we also see that all the character has some of the properties present in each of them irrespective of which member they belong e.g. name and member, and some data is unique to each member

This approach works. See that we can perfectly access properties and methods like this:

console.log(marvel_1.name) // output: "Iron Man"
console.log(dc_2.member) // output: "Justice League"
xmen_1.sayPhrase() // output: "So... This Is What It Feels Like!"
xmen_2.isMutant() // output: "yes"

Here we can see that it properly works, but this is not the appropriate way to use it in the programming as it is not feasible, as well as it is not scalable and error-prone also, suppose in the case where we need to create a hundred different character from the individual member we cannot create it as we would need to manually set the properties and methods for each of them!

Hence there could be a way such that we can reuse our code when there is a requirement as we have seen from above our most of the characters has the properties and methods same to other individuals irrespective of their "member" properties, and for the rescue come the "Classes"

Classes:

Classes set a blueprint to create objects with predefined properties and methods. By creating a class, you can later on instantiate (create) objects from that class, that will inherit all the properties and methods that class has.

Let's now refractored our previous code with the help of a class in this method we will create a class for each of the universe ,

class Marvel { // Name of the class
    // The constructor method will take a number of parameters and assign those parameters as properties to the created object.
    constructor (name, phrase) {
        this.name = name
        this.phrase = phrase
        this.member = "Avengers"
    }
    // These will be the object's methods.
    canfly = () => console.log("ssssssssssssshhhhhhhhhhh!!")
    sayPhrase = () => console.log(this.phrase)
}

class DC {
    constructor (name, phrase) {
        this.name = name
        this.phrase = phrase
        this.member = "Justice League"
    }
    hide = () => console.log("Catch us if you can!")
    sayPhrase = () => console.log(this.phrase)
}

class XMEN {
    constructor (name, phrase) {
        this.name = name
        this.phrase = phrase
        this.species = "X-men"
    }
    isMutant = () => console.log("yes")
    sayPhrase = () => console.log(this.phrase)
}

We have now created a particular class for each universe , which share similar properties, And then we can instantiate our characters from those classes like this:

const marvel_1 = new Marvel("Iron Man", "I'm Iron Man!")
// We use the "new" keyword followed by the corresponding class name
// and pass it the corresponding parameters according to what was declared in the class constructor function

const marvel_2 = new Marvel("Thor", "I'm still worthy!")
const dc_1 = new DC("Batman", "I am Batman!")
const dc_2 = new DC("Aquaman", "Tide is Calling!")
const xmen_1 = new XMEN("Wolverine", "So... This Is What It Feels Like!")
const xmen_2 = new XMEN("Pheonix", "I am Jean Grey!")

Now that we created our Each character from the classes, we can now make easy access to all the properties and methods like this,

console.log(marvel_1.name) // output: "Iron Man"
console.log(dc_2.member) // output: "Justice League"
xmen_1.sayPhrase() // output: "So... This Is What It Feels Like!"
xmen_2.isMutant() // output: "yes"

Now, What is the most important aspect of this type of object creation is that we have now reused our code as a classes and created our own character from that class itself, apart from the benefit of code reusability it also makes our code better organized as we can clearly identify where each object properties and methods are defined (in the class). And this makes future changes or adaptations much easier to implement.

Some things to keep in mind about classes:

Following this definition, that is provided by the one the reputed author from Freecodecamp named Germán Cocca,

"a class in a program is a definition of a “type” of custom data structure that includes both data and behaviours that operate on that data. Classes define how such a data structure works, but classes are not themselves concrete values. To get a concrete value that you can use in the program, a class must be instantiated (with the "new" keyword) one or more times."

1. Remember that classes aren't actual entities or objects. Classes are the blueprints or moulds that we're going to use to create the actual objects.

2. Class names are declared with a capital first letter and camelCase by convention. The class keyword creates a constant, so it cannot be redefined afterwards.

3. Classes must always have a constructor method that will later be used to instantiate that class. A constructor in JavaScript is just a plain old function that returns an object. The only thing special about it is that, when invoked with the "new" keyword, it assigns its prototype as the prototype of the returned object.

4. The “this” keyword points to the class itself and is used to define the class properties within the constructor method.

5. Methods can be added by simply defining the function name and its execution code.

6. JavaScript is a prototype-based language, and within JavaScript, classes are used only as syntactic sugar. This doesn't make a huge difference here, but it's good to know and keep in mind.

Conclusion:

From the above Part 1 we got, to know how the objects are created using the conventional objects literals and how to access the properties and methods that are present inside the Objects, we also got to know the Classes act as Blueprints for the creation of the objects by promoting the code reusability and it also makes our code better organized that is the requirements for the Object Oriented Programming(OOP) paradigms

Furthermore, In the Next Part Of the OOP we get more deeper understanding of how the OOP paradigms operate in a more Projective way, and as well as we will also explore more deeper about major concepts and 4 Pillars of OOP paradigms Abstraction, Encapsulation, Inheritance and Polymorphism

So, Stay tuned we have more to explore in Part 2

please leave a comment if you have any questions or feedback.

I've learned this stuff on the internet as well, Here are the resources given and tried to simplify it from the user's perspective.