JavaScript Object-Oriented Programming (OOP) | Complete Course

Welcome to this comprehensive tutorial on writing object-oriented programming (OOP) with JavaScript. Object-oriented programming is a powerful paradigm that allows you to create organized, efficient, and reusable code. In this tutorial, we will cover the basics of object-oriented programming in JavaScript, as well as advanced topics such as inheritance, polymorphism, and encapsulation.

Introduction to Object-oriented Programming (OOP)
Object-oriented programming is a programming paradigm based on the concept of "objects", which can contain data in the form of properties and methods to manipulate that data. JavaScript is a versatile language that supports object-oriented programming through its prototype-based inheritance system.

Objects in JavaScript are instances of classes, which define the structure and behavior of the object. In JavaScript, classes are created using the "class" keyword, and objects are created using the "new" keyword.

Creating Classes and Objects in JavaScript
To create a class in JavaScript, you use the "class" keyword followed by the name of the class. Inside the class, you can define properties and methods using the constructor method and other class methods.

class Animal {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  speak() {
    console.log(`${this.name} is speaking`);
  }
}

// Creating an object of the Animal class
let myAnimal = new Animal('Lion', 5);
myAnimal.speak(); // Output: Lion is speaking

In the example above, we have created a class called "Animal" with properties "name" and "age", and a method "speak". We then created an object of the Animal class using the "new" keyword and called the speak method on the object.

Inheritance in JavaScript
Inheritance is a key concept in object-oriented programming that allows you to create new classes based on existing ones. In JavaScript, you can achieve inheritance using the "extends" keyword.

class Dog extends Animal {
  constructor(name, age, breed) {
    super(name, age);
    this.breed = breed;
  }

  bark() {
    console.log(`Woof! I am a ${this.breed}`);
  }
}

let myDog = new Dog('Buddy', 3, 'Labrador');
myDog.speak(); // Output: Buddy is speaking
myDog.bark(); // Output: Woof! I am a Labrador

In the example above, we have created a class called "Dog" that extends the "Animal" class. The Dog class inherits the properties and methods from the Animal class and adds a new property "breed" and a new method "bark".

Polymorphism in JavaScript
Polymorphism is the ability for objects of different classes to be treated as objects of a common superclass. In JavaScript, polymorphism can be achieved through method overriding.

class Cat extends Animal {
  constructor(name, age, color) {
    super(name, age);
    this.color = color;
  }

  speak() {
    console.log(`${this.name} is meowing`);
  }
}

let myCat = new Cat('Whiskers', 2, 'Grey');
myCat.speak(); // Output: Whiskers is meowing

In the example above, we have created a class called "Cat" that extends the "Animal" class and overrides the speak method. When we call the speak method on a Cat object, it calls the overridden method from the Cat class.

Encapsulation in JavaScript
Encapsulation is the practice of bundling data and methods that operate on the data into a single unit called a class. JavaScript does not have built-in support for access control modifiers like private or protected, but you can achieve encapsulation through closures.

class Counter {
  constructor() {
    let count = 0;

    this.increment = function() {
      count++;
    };

    this.getCount = function() {
      return count;
    };
  }
}

let myCounter = new Counter();
myCounter.increment();
console.log(myCounter.getCount()); // Output: 1

In the example above, we have created a class called "Counter" with a private variable "count" and methods to increment the count and retrieve the count value. The count variable is encapsulated within the Counter class and cannot be accessed or modified directly from outside the class.

Conclusion
In this tutorial, we have covered the basics of object-oriented programming in JavaScript, including creating classes and objects, inheritance, polymorphism, and encapsulation. Object-oriented programming is a powerful paradigm that can help you write organized, efficient, and reusable code. Practice what you have learned in this tutorial by creating your own classes and objects in JavaScript. Thank you for reading!