Introduction to Object Oriented Programming in JavaScript

Introduction to Object Oriented Programming in JavaScript

Introduction to Object bound Programming in JavaScript
As JavaScript is wide employed in net Development, during this article we might explore a number of the article bound mechanism supported by JavaScript to urge most out of it. a number of the common interview question in JavaScript on OOPS includes,- “How Object-Oriented Programming is enforced in JavaScript? however they dissent from alternative languages? are you able to implement Inheritance in JavaScript then on…”

There square measure bound options or mechanisms that makes a Language Object bound like:

• Object
• Classes
• Encapsulation
• Inheritance

Let’s dive into the small print of every one in all them and see however they're enforced in JavaScript.

Object– associate Object could be a distinctive entity that contains property and ways. as an example “car” could be a world Object, that have some characteristics like color, type, model, HP and performs bound action like drive. The characteristics of associate Object square measure known as as Property, in Object bound Programming and therefore the actions square measure known as ways. associate Object is associate instance of a category. Objects square measure all over in JavaScript virtually each component is associate Object whether or not it's a perform,arrays and string.
Note: a way in javascript could be a property of associate object whose worth could be a perform.
Object will be created in 2 ways that in



    Using an Object Literal
//Defining object
let person = {
first_name:’SI’,
last_name: ‘Sayed’,

//method
getFunction : function(){
return (`The name of the person is
${person.first_name} ${person.last_name}`)
},
//object within object
phone_number : {
mobile:’12345′,
landline:’6789′
}
}

console.log(person.getFunction());
console.log(person.phone_number.landline);


Using Object.create() method: the thing.create() methodology creates a brand new object, exploitation associate degree existing object because the model of the new created object.
// Object.create() example a


// Defining class using es6
class Vehicle {
constructor(name, maker, engine) {
this.name = name;
this.maker = maker;
this.engine = engine;
}
getDetails(){
return (`The name of the bike is ${this.name}.`)
}
}
// Making object with the help of the constructor
let bike1 = new Vehicle(‘Hayabusa’, ‘Suzuki’, ‘1340cc’);
let bike2 = new Vehicle(‘Ninja’, ‘Kawasaki’, ‘998cc’);
console.log(bike1.name); // Hayabusa
console.log(bike2.maker); // Kawasaki
console.log(bike1.getDetails());


// Defining class in a Traditional Way.
function Vehicle(name,maker,engine){
this.name = name,
this.maker = maker,
this.engine = engine
};

Vehicle.prototype.getDetails = function(){
console.log('The name of the bike is '+ this.name);
}

let bike1 = new Vehicle('Hayabusa','Suzuki','1340cc');
let bike2 = new Vehicle('Ninja','Kawasaki','998cc');

console.log(bike1.name);
console.log(bike2.maker);
console.log(bike1.getDetails());

Encapsulation – the method of wrapping property and performance inside one unit is understood as encapsulation.
Let’s perceive encapsulation with associate degree example.
//encapsulation example



class person{
constructor(name,id){
this.name = name;
this.id = id;
}
add_Address(add){
this.add = add;
}
getDetails(){
console.log(`Name is ${this.name},Address is: ${this.add}`);
}
}
let person1 = new person(‘Mukul’,21);
person1.add_Address(‘Delhi’);
person1.getDetails();


In the higher than example we tend to merely produce associate person Object victimisation the creator and Initialize it property and use it functions we tend to aren't hassle regarding the implementation details. we tend to square measure operating with associate Objects interface while not considering the implementation details.
Sometimes encapsulation refers to concealing knowledge|of knowledge|of information} or data Abstraction which implies representing essential options concealing the background detail. Most of the OOP languages offer access modifiers to limit the scope of a variable, however their aren't any such access modifiers in JavaScript however their square measure bound method by that we will limit the scope of variable inside the Class/Object.



Example:

// Abstraction example
function person(fname,lname){
let firstname = fname;
let lastname = lname;
let getDetails_noaccess = function(){
return (`First name is: ${firstname} Last
name is: ${lastname}`);
}

this.getDetails_access = function(){
return (`First name is: ${firstname}, Last
name is: ${lastname}`);
}
}
let person1 = new person(‘Mukul’,’Latiyan’);
console.log(person1.firstname);
console.log(person1.getDetails_noaccess);
console.log(person1.getDetails_access());


In the on top of example we have a tendency to try and access some property(person1.firstname) and functions(person1.getDetails_noaccess) however it returns undefine whereas their may be a methodology that we are able to access from the person object(person1.getDetails_access()), by dynamic the thanks to outline a perform we are able to limit it


Inheritance – it's an inspiration within which some property associated strategies of an Object is being employed by another Object. in contrast to most of the OOP languages wherever categories inherit categories, JavaScript Object inherits Object i.e. bound options (property and methods)of one object will be reused by different Objects.
Lets’s perceive inheritance with example:



//Inhertiance example
class person{
constructor(name){
this.name = name;
}
//method to return the string
toString(){
return (`Name of person: ${this.name}`);
}
}
class student extends person{
constructor(name,id){
//super keyword to for calling above class constructor
super(name);
this.id = id;
}
toString(){
return (`${super.toString()},Student ID: ${this.id}`);
}
}
let student1 = new student(‘Mukul’,22);
console.log(student1.toString())


In the higher than example we have a tendency to outline AN Person Object with bound property and technique and so we have a tendency to inherit the Person Object within the Student Object and use all the property and technique of person Object furthermore outline bound property and ways for Student.
Note: The Person and Student object each have same technique i.e toString(), this can be referred to as as technique dominant. technique dominant permits technique in a very kid category to possess a similar name and technique signature as that of a parent category.
In the higher than code, super keyword is employed to refer immediate parent category instance variable.


Please write comments if you discover something incorrect, otherwise you need to share a lot of info regarding the subject mentioned higher than.