site logo

HomeProfilePages
: (All)
Add Topic

Successfully added a good point.
❮  Go Back

05. JavaScript Classes: Defining Classes, Inheritance & Static Methods

Posted on 2025-10-12 17:15:41

Price: $0.00

Quota Left: 0

By coldshadow44

Introduction

Classes in JavaScript provide a cleaner, more expressive syntax for object-oriented programming. They let you define blueprints for objects, support inheritance, and define static (class-level) methods. In this post you will learn:

  1. How to define a class
  2. How to use inheritance with extends
  3. How to use and define static methods and properties


1. Defining a Class

You can define a class in JavaScript using the class keyword. A class encapsulates a constructor and methods.

Syntax:


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

greet() {
return `Hi, I am ${this.name}, aged ${this.age}`;
}
}
  1. constructor(...) is a special method used when creating a new instance
  2. Methods defined in the class (like greet) become part of the prototype and are shared across instances
  3. You instantiate with new:

const alice = new Person("Alice", 30);
console.log(alice.greet());


2. Class Inheritance

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

Syntax:


class Employee extends Person {
constructor(name, age, role) {
super(name, age); // call parent constructor
this.role = role;
}

describeRole() {
return `I am a ${this.role}`;
}
}
  1. extends sets up the prototype chain
  2. super(...) calls the parent class constructor (must be used before accessing this)
  3. Subclasses inherit methods from the parent:

const bob = new Employee("Bob", 25, "Developer");
console.log(bob.greet()); // From Person
console.log(bob.describeRole()); // From Employee

You can also override parent methods:


class Employee extends Person {
greet() {
const base = super.greet();
return `${base}. My role is ${this.role}`;
}
}

Here super.greet() calls the parent’s greet method within the child.


3. Static Methods & Properties

Static methods are defined on the class itself, not on instances. They’re useful for utility operations that don’t depend on instance data.

Definition:


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

static description = "Utility class for math operations";
}
  1. Call static methods via the class, not an instance:

console.log(MathUtil.add(4, 5)); // 9
console.log(MathUtil.description); // "Utility class for math operations"
  1. Static methods cannot access this in the context of an instance—they’re detached from instances
  2. Static methods are often used for factory methods, helper functions, or operations on class-wide data

You can also define static properties using the static keyword (supported in newer JavaScript versions).


Conclusion

JavaScript’s class syntax provides a more intuitive way to write object-oriented code. With classes, you can:

  1. Define reusable blueprints (constructors and methods)
  2. Extend behavior via inheritance
  3. Use static methods and properties for class-level logic


Comments[0]Subscribers Delete Edit Like!

Member's Sites: