JavaScript

Is JavaScript Object-Oriented?

Object-Oriented Programming (OOP), is a programming approach that is used by every developer at some point in their life to organize software design around objects or data rather than logic or functions where an object is an entity that has some properties and some type. The benefits of using the OOP technique include modularity, reusability, security, productivity, flexibility, and is easily scalable and upgradeable.

Features of OOP

The three major features of OOP are as follows:

i) Encapsulation

Encapsulation is a concept of OOP that bundles data and methods which operate on that data within one unit, for example, a class in java and an instance of a class is called an object. Encapsulation also refers to restricting data access to some classes or objects and hence all the users won’t be able to access variables or state values of some object.

ii) Inheritance

In Inheritance one class (child) inherits all the methods and attributes of another (parent) class.

iii) Polymorphism

Polymorphism means a property having many forms and is one of the core concepts in OOP. Polymorphism lets us create procedures about objects whose exact type is not known till runtime.

JavaScript Object-Oriented?

JavaScript is a programming language based on prototypes and is mainly used to create web applications and web pages. Prototype programming language is a style of OOP in which objects that are already created can be cloned and reused so that the program or application can be constructed. Functions are used as constructors for classes in prototype-based programming languages.

JavaScript is excellent in programming OOP applications and is heavily object-based however it is not a class-based OOP language but rather a Prototype-based programming language. However, we can use JavaScript as a class-based programming language. JavaScript allows you to make or create new objects for the use of your application. However, it should be noted that while OOP language encourages and focuses on relationships and taxonomy, prototype-based languages focus and encourage behavior first and then classification later.

In 2015 JavaScript introduced a class keyword which was to make JavaScript OOP language but it was just synthetic sugar over the existing prototype technique. The outer body looks like OOP, however in the background the prototyping continues.

Below is an example of OOP in JavaScript where we used class for defining student objects and has the property of name and grade and method studies() which returns name and grade of the student.

class student {
  constructor(name, grade) {
      this.name = name;
      this.grade = grade;
  }
  studies() {
      return `${this.name} studies in ${grade}`;
  }
}
let myStudent1 = new student("Jhon", 6);
console.log(myStudent1);

If we expand the prototype seen in the above screenshot we will see that the proto references the student prototype which in fact references the Object prototype.

JavaScript Encapsulation Example

Let us look at an example where inheritance is used and the person class or object is defined where a person has a name and a method is also defined where the name is returned. Another class student is defined which extends person hence inheriting all the properties and methods of parent class i-e person and in the child class i-e student class, we utilized the super keyword that invokes the constructor of the parent or person class. You will also be able to see that the person object and student object both have a method with the same name toString(). This is called overriding and OOP allows us to have a method in a child class with the same name and signature as that of the parent class.

//Example of Inheritance
class person{
  constructor(name){
      this.name = name;
  }
  //String returns from this method
  toString(){
      return (`Name: ${this.name}`);
  }
}
class student extends person{
  constructor(name,regid){
      //super keyword used to call Parent constructor
      super(name);
      this.regid = regid;
  }
  toString(){
      return (`${super.toString()}, Registration ID: ${this.regid}`);
  }
}
let myStudent1 = new student('Jhon',1032);
alert(myStudent1.toString());

Conclusion

OOP is a programming model that organizes our software design around objects rather than logic or functions.  An object has some property and value. By using OOP we achieve security, productivity, reusability, and much more.

JavaScript is a programming language that is based on prototypes, however in 2015 class keyword was introduced which makes JavaScript like an OOP programming language but as we saw in the above description that in the background prototyping continues. To put it simply,  JavaScript is a prototyping-based Object Oriented Programming language.

About the author

Shehroz Azam

A Javascript Developer & Linux enthusiast with 4 years of industrial experience and proven know-how to combine creative and usability viewpoints resulting in world-class web applications. I have experience working with Vue, React & Node.js & currently working on article writing and video creation.