Abstract classes share implementation while requiring subclasses to fill in missing behavior.

abstract class An abstract class can contain shared code and abstract methods that subclasses must implement.

Abstract Classes

side
abstract.ts
Replay: real traced execution (multi-file project)
abstract class Shape {
    abstract area(): number;

    describe(): string {
        return `area=${this.area()}`;
    }
}

class Square extends Shape {
    side: number;

    constructor(side: number) {
        super();
        this.side = side;
    }

    area(): number {
        return this.side * this.side;
    }
}

const side: number = 4;
const shape: Shape = new Square(side);

console.log(shape.describe());
abstract class Shape {
    abstract area(): number;

    describe(): string {
        return `area=${this.area()}`;
    }
}

class Square extends Shape {
    side: number;

    constructor(side: number) {
        super();
        this.side = side;
    }

    area(): number {
        return this.side * this.side;
    }
}

const side: number = 2;
const shape: Shape = new Square(side);

console.log(shape.describe());
abstract class Shape {
    abstract area(): number;

    describe(): string {
        return `area=${this.area()}`;
    }
}

class Square extends Shape {
    side: number;

    constructor(side: number) {
        super();
        this.side = side;
    }

    area(): number {
        return this.side * this.side;
    }
}

const side: number = 6;
const shape: Shape = new Square(side);

console.log(shape.describe());
  1. side ← 4, this.side ← 4, shape ← [object Object]

    12    constructor(side: number) {13        super();14        this.side = side4;15    }1617    area(): number {18        return this.side * this.side;19    }20}2122const side→ 4: number = 4;  //@side=2, 623const shape→ [object Object]: Shape = new Square(side4);2425console.log(shape[object Object].describe());
    values this step4this.side
  2. area(): number

    14    this.side = side;15}1617area(): number {18    return this.side * this.side4;19}
  3. console.log(shape.describe());

    22const side: number = 4;  //@side=2, 623const shape: Shape = new Square(side);2425console.log(shape[object Object].describe());
    outputarea=16
  1. side ← 2, this.side ← 2, shape ← [object Object]

    12    constructor(side: number) {13        super();14        this.side = side2;15    }1617    area(): number {18        return this.side * this.side;19    }20}2122const side→ 2: number = 2;23const shape→ [object Object]: Shape = new Square(side2);2425console.log(shape[object Object].describe());
    values this step2this.side
  2. area(): number

    14    this.side = side;15}1617area(): number {18    return this.side * this.side2;19}
  3. console.log(shape.describe());

    22const side: number = 2;23const shape: Shape = new Square(side);2425console.log(shape[object Object].describe());
    outputarea=4
  1. side ← 6, this.side ← 6, shape ← [object Object]

    12    constructor(side: number) {13        super();14        this.side = side6;15    }1617    area(): number {18        return this.side * this.side;19    }20}2122const side→ 6: number = 6;23const shape→ [object Object]: Shape = new Square(side6);2425console.log(shape[object Object].describe());
    values this step6this.side
  2. area(): number

    14    this.side = side;15}1617area(): number {18    return this.side * this.side6;19}
  3. console.log(shape.describe());

    22const side: number = 6;23const shape: Shape = new Square(side);2425console.log(shape[object Object].describe());
    outputarea=36