JavaScript OOPS

0 4876

We all know real-time modeling is a basic requirement of emerging programming languages.

Wondered! How is it possible?

It's through the OOPs concept. This is doubtlessly found in several other programming languages like Java and C++. In this post, I am going to explore the OOP, OOP in JavaScript and its fundamental elements. As I know that during Application Development with JavaScript, it is important for developers to know how to embrace the concept of OOPs completely.

Let's continue

What is OOPs?

OOPs, can be referred to as the programming paradigm erected over objects. It is indeed used to model real-time tasks/things into coding i.e. modeling of something through programs.

OOPs, include managing chunks of code and converting it into reusable. Moreover, it permits the developer to build complex applications without affecting the other programming aspects.

Benefits of OOPS in JS:

i) Code reusability

ii) Simplify code modification

iii) It simplifies the access of functionalities

iv) Enhance productivity

v) Boost security in modules

vi) Code extensibility

vii) Ease of code maintenance

JavaScript is deeply rooted in the OOPs concept. It integrates some terms such as abstraction, objects, classes, encapsulation, modularity, privacy, polymorphism, inheritance, etc.

Let's dig into the relevant parts of OOPs in JavaScript.

Object-Oriented Paradigm

As per OOP's viewpoint, an application consists of objects for interactions. These objects are used to model things in the real world into programs. Objects include data to perform some actions depending upon that data.

OBJECTS

Every element in JavaScript can be referred to as objects. We can call an object as a unique entity with methods and properties. In JavaScript as in other object-oriented languages, an object consists of interrelated data that is used to represent the real-life scenario in programs.

To learn in detail the complete definition of objects along with programs. Click on the below-given link.

https://www.codingtag.com/javascript-objects

CLASS

The concept of class is identical as in other object-oriented languages i.e. object's blueprint. JavaScript also supports the class to create the objects in various scenarios. As the objects are known as the instances of class, thus classes are implemented by the developer to represent the shared methods and properties.

Whenever an object has been created depending upon the class, the newly created object is known as an instance of that particular class.

The new keyword is used to create an instance of the class in JavaScript.

Highlights of JavaScript classes:

In JavaScript, a class keyword can be used for declaring a class.

While integrating classes, there is a need to follow the JavaScript naming conventions.

For Example:

The class name begins with an uppercase letter

Developers can declare a class only once. If they try to declare the same class multiple times, it will create an error.

Class in JavaScript can have multiple objects.

A simple program illustrating class in JS:

<!DOCTYPE html>
<html>
<body>

<script>
// Declaring class
class Bag
  {
// Initialising an object
   constructor(no,name)
   {
    this.no=no;
     this.name=name;
   }
// Declaring method
   description()
   {
  document.writeln(this.no+" "+this.name+"<br>")
   }
  }
// passing object to a variable
var b1=new Bag(14,"chanel");
var b2=new Bag(23,"Alexander McQueens");
b1.description(); //calling method
b2.description();
</script>

</body>
</html>

The above-program is a simple use case to illustrate the class implementation in JavaScript. It includes class declaration; two objects are created through that class.

Output appeared as follow:

Inheritance:

Inheritance is another powerful element of JavaScript OOPs. It is a class-based mechanism in which some properties and methods of one object are being acquired by another object.

This process includes the reuse of an object by another object according to the specification of the program. Developers implicitly use the concept of inheritance while implementing certain features of Web API.

This involves functionality sharing between the objects which indeed known as delegation. Each object comprises of a private property called a prototype to hold the object linking involved in inheritance. This prototype in JS permits to inherit of properties from one object to another.

Highlights of JavaScript inheritance

Inheritance permits the developer to generate new classes through existing classes

IS-A relationship maintenance

Enhance code flexibility

The methods, properties, and variables of one class can be reused.

In JavaScript, though an "extends keyword" developer can acquire the properties of other classes or objects.

Let's understand the concept of inheritance through an example

<!DOCTYPE html>
<html>
<body>

<script>
class Bag
{
  constructor()
  {
    this.brand="pyjips";
  }
}
class product extends Bag {
 constructor(colour,cost) {
  super();
   this.colour=colour;
   this.cost=cost;
  }
}
var b = new product("red","890000");
document.writeln(b.brand+" "+b.colour+" "+b.cost);
</script>

</body>
</html>

Output:

pyjips red 890000

That is all about the OOPs concept.

Important Blog: Javascript Interview Questions

Though this post I have tried to cover the major elements relevant to JavaScript. However, I will cover other elements too.

Stay tuned with Coding Tag to get updated with other fundamentals in detail such as Encapsulation, JavaScript prototype, polymorphism, and JavaScript static method with interesting examples and explanation.

Thank you