CodeToLive

Object-Oriented Programming in JavaScript

Object-Oriented Programming (OOP) is a programming paradigm that uses objects and classes to structure and organize code. JavaScript supports OOP principles like encapsulation, inheritance, and polymorphism.

Classes and Objects

A class is a blueprint for creating objects. An object is an instance of a class.


// Class and Object Example
class Dog {
    constructor(name, breed) {
        this.name = name;
        this.breed = breed;
    }

    bark() {
        return "Woof!";
    }
}

const myDog = new Dog("Buddy", "Golden Retriever");
console.log(myDog.bark());  // Output: Woof!
      

Inheritance

Inheritance allows a class to inherit properties and methods from another class. The extends keyword is used.


// Inheritance Example
class Animal {
    speak() {
        return "Animal sound";
    }
}

class Cat extends Animal {
    speak() {
        return "Meow";
    }
}

const myCat = new Cat();
console.log(myCat.speak());  // Output: Meow
      

Encapsulation

Encapsulation is the bundling of data and methods that operate on the data into a single unit (class). In JavaScript, encapsulation can be achieved using closures or private fields (introduced in ES2022).


// Encapsulation Example
class Person {
    #name; // Private field

    constructor(name) {
        this.#name = name;
    }

    getName() {
        return this.#name;
    }
}

const person = new Person("Alice");
console.log(person.getName());  // Output: Alice
// console.log(person.#name);  // Error: Private field cannot be accessed outside the class
      

Polymorphism

Polymorphism allows methods to behave differently based on the object that calls them. It is achieved through method overriding.


// Polymorphism Example
class Animal {
    speak() {
        return "Animal sound";
    }
}

class Dog extends Animal {
    speak() {
        return "Woof!";
    }
}

class Cat extends Animal {
    speak() {
        return "Meow";
    }
}

const animals = [new Dog(), new Cat()];
animals.forEach(animal => console.log(animal.speak()));
// Output: Woof!
//         Meow
      

Abstraction

Abstraction is the concept of hiding complex implementation details and exposing only the necessary features. In JavaScript, abstraction can be achieved using classes and interfaces (via TypeScript or design patterns).


// Abstraction Example
class Shape {
    draw() {
        throw new Error("Method 'draw()' must be implemented.");
    }
}

class Circle extends Shape {
    draw() {
        return "Drawing a circle.";
    }
}

const circle = new Circle();
console.log(circle.draw());  // Output: Drawing a circle.
      

Static Methods and Properties

Static methods and properties belong to the class itself rather than instances of the class. They are accessed using the class name.


// Static Methods and Properties Example
class MathUtils {
    static PI = 3.14;

    static square(num) {
        return num * num;
    }
}

console.log(MathUtils.PI);  // Output: 3.14
console.log(MathUtils.square(5));  // Output: 25
      

Getters and Setters

Getters and setters allow you to define methods to get or set the value of an object's properties.


// Getters and Setters Example
class Person {
    constructor(name) {
        this._name = name;
    }

    get name() {
        return this._name;
    }

    set name(newName) {
        this._name = newName;
    }
}

const person = new Person("Alice");
console.log(person.name);  // Output: Alice
person.name = "Bob";
console.log(person.name);  // Output: Bob
      
Back to Tutorial