Introduction to Object-oriented programming (OOP)

 

Object-oriented programming is a computer programming model that organizes software design around data, or objects, instead of functions and logic.

There are 4 core concepts in OOP:

• Encapsulation
• Abstraction
• Inheritance
• Polymorphism

In OOP we combine a group of related variables and functions into an unit and we call that unit, an object. We refer to these variables as *properties* and the functions as *methods*.

For example, we can think of a car as an object with properties as model, color and methods like start, stop and move.

localStorage in our browsers is an object, that allows us to store data locally.
This local storage object as a property like length which returns the number of objects in the storage and methods like setItem and removeItem

In OOP we group related variables and functions that operate on them into objects and this is what we call Encapsulation

Procedural Programming: we have variables on one side and functions on the other

Procedural Programming Example:

let baseSalary = 30_000;
let overTime = 10;
let rate = 20;

function getWage(baseSalary, overtime, rate) {
return baseSalary + (overTime * rate);
}

OOP way example:

let employee = { 
    baseSalary: 30_000,
    overtime: 10,
    rate: 20,
    gateWage: function() {
        return this.baseSalary + (this.overtime * this.rate);
    }
};

Why is this better?

• getWage function has no parameters (in contrast in procedural example we have 3 parameters)
• in the second case we don't have these parameters because they are actually modeled as properties of this object.

Encapsulation

Is the concept of wrapping up of data under a single unit. It is the mechanism that binds together code and the data it manipulates. It acts like a protective shield that prevents the data from being accessed by the code outside this shield.

Abstraction

DVD player as an object. The DVD player has a complex logic board on the inside and a few buttons on the outside that you interact with. You simply press the play button and you dont care what happens on the inside. All the complexity is hidden from you. That's abstraction

We can use the same technique on objects. We can hide some of the properties and methods from the outside and this gives us some benefits:

• the interface of those objects are simpler
• reduce the impact of change, if you change methods or properties on the inside, they will not leak to the outside, not affecting the rest of the application code

Inheritance

It is a mechanism that allows us to eliminate redundant code

We have checkboxes, text boxes, dropdown lists all these elements have a few things in common, they should have properties like hidden and innerHTML and methods like click and focus. Instead of redefining all these properties and methods for every type of HTML element, we can define them once in a generic object called HTML element and have other objects inherit their properties and methods.

Polymorphism

Polymorphism means "Many Forms"
it allows us to get rid of long if and else or switch-case statements.