GV

GeezerVison

The World Wide Web, restored to 800 pixels of glory.

Home|About|Gaming cabinet|Archives|How it works|Starter sites

On this site

  • JS Tutorial
  • Web Tutorial
  • A to Z Guide
  • Projects
  • OOP
  • DOM
  • Set
  • Map
  • Math
  • Number
  • Boolean
  • Exercise
  • class
  • constructor()

This view

  • Original page
  • New address

GeezerVison is showing www.geeksforgeeks.org — JS Classes In JavaScript - GeeksforGeeks

geeksforgeeks
search icon
  • Courses
  • Tutorials
  • Interview Prep
  • JS Tutorial
  • Web Tutorial
  • A to Z Guide
  • Projects
  • OOP
  • DOM
  • Set
  • Map
  • Math
  • Number
  • Boolean
  • Exercise

JavaScript Classes

Last Updated : 17 Jun, 2026

A JavaScript class is a blueprint for creating objects. It allows developers to define properties and methods in a single structure, making code more organized, reusable, and easier to maintain.

  • Introduced in ES6, classes provide a structured way to create objects with shared properties and methods.
  • They support object-oriented programming concepts such as inheritance, encapsulation, and modularity.
javascript_class
Javascript Class

Syntax

class ClassName {
    constructor() {
        // Initialize properties here
    }
    // Define methods here
    methodName() {
        // Method code
    }
}
  • The class keyword is used to declare a class.
  • The constructor() method is a special method that is automatically called when an instance of the class is created.
  • You can define methods inside the class to provide behaviour for objects created from the class.

Key Features of JavaScript Classes

  • Encapsulation: Bundles data (properties) and behaviour (methods) together.
  • Constructor Method: Initializes properties when an object is created.
  • Inheritance: Allows one class to inherit properties and methods from another.
  • Code Reusability: Enables the creation of multiple instances with shared functionality.
  • Simplicity & Clarity: Provides a clear structure for creating and managing objects.

Creating a Simple Class

A basic class that defines properties and methods. This example shows how to create an object with a constructor and method.

JavaScript
class Person {
    constructor(name, age) {
        this.name = name;
        this.age = age;
    }
    g() {
        console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
    }
}
let p1 = new Person("Pranjal", 20);
p1.g();
  • The Person class has a constructor to set name and age, and a g method to log a greeting message.
  • An instance (p1) is created with new, passing "Pranjal" and 20, then calls g to print the greeting.

Constructor to Initialize Objects

The constructor is used to initialize the properties of the object when an instance is created.

JavaScript
class Car {
    constructor(make, model, year) {
        this.make = make;
        this.model = model;
        this.year = year;
    }
    d() {
        console.log(`${this.year} ${this.make} ${this.model}`);
    }
}
let my = new Car("Toyota", "Corolla", 2021);
my.d();
  • The Car class has a constructor to initialize make, model, and year, and a d method to log the car's details.
  • An instance (my) is created with new, passing "Toyota", "Corolla", and 2021, then calls d to print the car's information.

Inheritance in Classes

Inheritance allows one class to extend another, inheriting its properties and methods while adding or overriding functionality.

JavaScript
class Car {
    constructor(make, model, year) {
        this.make = make;
        this.model = model;
        this.year = year;
    }
    di() {
        console.log(`${this.year} ${this.make} ${this.model}`);
    }
}
class ElectricCar extends Car {
    constructor(make, model, year, batteryLife) {
        super(make, model, year);
        this.batteryLife = batteryLife;
    }
    d() {
        console.log(`Battery life: ${this.batteryLife} hours`);
    }
}
let tesla = new ElectricCar("Tesla", "Model S", 2022, 24);
tesla.di()
tesla.d();
  • ElectricCar inherits from Car, using super to set properties and adds batteryLife and d method.
  • An instance (tesla) calls both di to display car details and d to show battery life.

Creating Multiple Objects from a Class

Using classes to create multiple objects with the same structure but different data.

JavaScript
class Car {
    constructor(make, model, year) {
        this.make = make;
        this.model = model;
        this.year = year;
    }
    d() {
        console.log(`${this.year} ${this.make} ${this.model}`);
    }
}
let c1 = new Car("Toyota", "Corolla", 2021);
let c2 = new Car("Honda", "Civic", 2020);
c1.d();
c2.d(); 
  • The Car class initializes car details and has a d method to display them.
  • Two Car instances (c1 and c2) are created, and d is called on both to show their details.
Comment

Explore

    JavaScript Basics
    • Introduction3 min read
    • Variables5 min read
    • Operators4 min read
    • Control Statements4 min read
    Array & String
    • Arrays6 min read
    • Array Methods4 min read
    • String5 min read
    • String Methods8 min read
    Function & Object
    • Functions4 min read
    • Function Expression3 min read
    • Function Overloading4 min read
    • Objects4 min read
    • Constructors4 min read
    OOP
    • OOP5 min read
    • Classes & Objects4 min read
    • Access Modifiers5 min read
    • Constructor4 min read
    Asynchronous JavaScript
    • Asynchronous2 min read
    • Callbacks4 min read
    • Promises4 min read
    • Event Loop3 min read
    • Async Await Fuction3 min read
    Exception Handling
    • Error and Exceptional Handling5 min read
    • Errors Throw & Try to Catch2 min read
    • Custom Errors2 min read
    • TypeError Invalid Array.prototype.sort argument1 min read
    DOM
    • DOM8 min read
    • DOM Elements3 min read
    • Custom Events4 min read
    • Addeventlistener5 min read
    Advanced Topics
    • Closure3 min read
    • Hoisting5 min read
    • Scope4 min read
    • Higher Order Functions7 min read
    • Debugging3 min read
    Courses
    • Placement 360 Course2 min read
    • MERN Full Stack Course2 min read
    • DSA and System Design Course2 min read
You are visitor 01402503 — GeezerVison does not store the pages you look up.
Best viewed with Netscape Navigator 4.7 or Internet Explorer 6 at 800×600. No cookies required.