❮ Previous Next ❯

Classes & Objects

  • Learn how classes and objects work in JavaScript.

  • Introduction to Object-Oriented Programming (OOP)

    Object-Oriented Programming (OOP) is a programming approach that organizes code using objects instead of only functions and logic.

    JavaScript supports OOP concepts such as:

    • Classes

    • Objects

    • Encapsulation

    • Inheritance

    • Polymorphism

    • Abstraction

    In this lesson, we focus on the foundation of OOP:

    • Classes

    • Objects

    Why Do We Need OOP ?

    Without OOP:

    • Code becomes lengthy

    • Logic is repeated

    • Maintenance is difficult

    • Applications become hard to scale

    With OOP:

    • Code is modular

    • Reusability increases

    • Logic is organized

    • Applications are easier to maintain

    What Is a Class ?

    A class is a blueprint or template used to create objects.

    It defines:

    • Properties (variables)

    • Methods (functions)

    Real-Life Example of a Class

    Think of a class as a blueprint of a house:

    • Blueprint defines rooms, doors, windows

    • Actual houses are built using the blueprint

    Similarly:

    • Class defines structure

    • Objects are real instances created from it

Class Syntax Example

Defines a class with a constructor and methods. 

class ClassName {
  constructor() {
    // properties
  }

  methodName() {
    // behavior
  }
}

Simple Class Example

Creates a class with properties and a method to display data. 

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

  displayInfo() {
    console.log(`Name: ${this.name}, Age: ${this.age}`);
  }
}

  • Explanation

    • class Student → class declaration

    • constructor() → special method that runs when object is created

    • this → refers to the current object

    • displayInfo() → method of the class

    What Is an Object ?

    An object is a real instance of a class.

    Objects contain:

    • Actual values of properties

    • Ability to use class methods

    Creating Objects from a Class

    Objects are created using the new keyword.

    let student1 = new Student("Rahul", 20);

    let student2 = new Student("Switty", 22);

    Using Object Properties and Methods

    student1.displayInfo();

    student2.displayInfo();

    How Objects Work Internally

    Each object:

    • Has its own copy of properties

    • Shares methods defined in the class

    • Works independently

    Multiple Objects from One Class

    let s1 = new Student("Amit", 21);

    let s2 = new Student("Neha", 23);

    let s3 = new Student("Rohit", 19);

    One class → many objects.

    Constructor Method

    What Is a Constructor ?

    A constructor is a special method that:

    • Automatically runs when an object is created

    • Initializes object properties

Constructor Example

Uses a constructor to initialize object values when creating an instance. 

class Car {
  constructor(brand, model) {
    this.brand = brand;
    this.model = model;
  }

  showCar() {
    console.log(`${this.brand} ${this.model}`);
  }
}

let car1 = new Car("Toyota", "Innova");
car1.showCar();

  • Why this Keyword Is Important

    The this keyword:

    • Refers to the current object

    • Helps differentiate between class properties and local variables

    Example:

    this.name = name;

    Class Without Constructor

    A class can exist without a constructor.

Method Calling Example

Creates an object and calls a class method to display output. 

class Demo {
  sayHello() {
    console.log("Hello World");
  }
}

let obj = new Demo();
obj.sayHello();

  • Class vs Object (Comparison)

    Feature

    Class

    Object

    Definition

    Blueprint

    Instance

    Memory

    No memory for data

    Stores actual data

    Creation

    Defined once

    Can create many

    Purpose

    Design structure

    Use functionality

Class Methods Example

Uses multiple methods inside a class to perform calculations. 

class Calculator {
  add(a, b) {
    return a + b;
  }

  subtract(a, b) {
    return a - b;
  }
}
let calc = new Calculator();
console.log(calc.add(5, 3));

  • Encapsulation (Basic Understanding)

    Encapsulation means:

    • Binding data and methods together

    • Hiding internal details

    JavaScript uses classes to achieve encapsulation logically.

    Common Mistakes

    • Forgetting new keyword

    • Misusing this

    • Calling methods without object

    • Naming class with lowercase letter

    • Confusing class and object

    Best Practices for Classes & Objects

    • Use PascalCase for class names

    • Keep one class focused on one responsibility

    • Avoid global variables

    • Use meaningful method names

    • Create reusable classes

    Real-World Use Cases

    • User management system

    • Student record system

    • Product catalog

    • Banking applications

    • Game characters

❮ Previous Next ❯