Lesson 5 • Intermediate
Classes and Objects 🏛️
Access modifiers, abstract classes, interface implementation, and design patterns — everything you need for OOP in TypeScript.
What You'll Learn in This Lesson
- • Access modifiers:
public,private,protected,readonly - • Parameter properties shorthand
- • Inheritance, abstract classes, and interface implementation
- • Static members and the Singleton pattern
- • Builder pattern for fluent APIs
1️⃣ Class Basics & Access Modifiers
TypeScript adds public, private, protected, and readonly modifiers to JavaScript classes, plus a shorthand syntax for constructor parameters that creates and assigns properties automatically.
Try It: Classes
Access modifiers, getters/setters, and parameter properties
// TypeScript Classes — Access Modifiers & More
console.log("=== Basic Class with Types ===");
console.log();
class User {
constructor(name, email, age) {
this.name = name;
this.email = email;
this.age = age;
}
greet() { return "Hi, I'm " + this.name + " (" + this.age + ")"; }
toString() { return this.name + " <" + this.email + ">"; }
}
let alice = new User("Alice", "alice@example.com", 28);
console.log(alice.greet());
console.log(alice.toString());
console.log();
// Acces
...2️⃣ Inheritance & Abstracts
Classes can extend other classes and implement interfaces. Abstract classes define a template: some methods are implemented, others must be provided by subclasses. A class can implement multiple interfaces.
Try It: Inheritance
Subclasses, abstract classes, and interface implementation
// Inheritance, Abstract Classes, and Interfaces
console.log("=== Class Inheritance ===");
class Shape {
constructor(name, color) { this.name = name; this.color = color; }
describe() { return this.color + " " + this.name; }
area() { return 0; } // override in subclass
}
class Circle extends Shape {
constructor(radius, color) {
super("circle", color);
this.radius = radius;
}
area() { return Math.round(Math.PI * this.radius * this.radius * 100) / 100; }
}
class Rectangle ext
...3️⃣ Static Members & Patterns
Static members belong to the class itself, not instances. Combined with TypeScript's type system, classic design patterns like Singleton and Builder become type-safe and elegant.
Try It: Design Patterns
Static members, Singleton, and Builder pattern
// Static Members, Singletons, and Design Patterns
console.log("=== Static Members ===");
class MathUtils {
static PI = 3.14159;
static circleArea(r) { return MathUtils.PI * r * r; }
static factorial(n) { return n <= 1 ? 1 : n * MathUtils.factorial(n - 1); }
static clamp(val, min, max) { return Math.min(Math.max(val, min), max); }
}
console.log("MathUtils.PI = " + MathUtils.PI);
console.log("MathUtils.circleArea(5) = " + MathUtils.circleArea(5).toFixed(2));
console.log("MathUtils.facto
...⚠️ Common Mistakes
super() — Subclass constructors must call super() before using this.private is compile-time only — At runtime, JavaScript has no access modifiers. Use #field for true runtime privacy.📋 Quick Reference
| Feature | Syntax |
|---|---|
| Public | public name: string |
| Private | private balance: number |
| Protected | protected type: string |
| Readonly | readonly id: string |
| Abstract | abstract speak(): string |
| Implements | class X implements Y, Z |
🎉 Lesson Complete!
You've mastered OOP in TypeScript! Next, explore advanced types like unions, conditionals, and mapped types.
Sign up for free to track which lessons you've completed and get learning reminders.