TypeScript Constructor: Parameter Properties and Overloads

A constructor in TypeScript is the class's constructor method with typed parameters. It has no return type annotation: it always produces an instance of the class.

class Product {
    name: string;
    price: number;

    constructor(name: string, price: number) {
        this.name = name;
        this.price = price;
    }
}

const p = new Product("Lamp", 39);
console.log(p); // Product { name: 'Lamp', price: 39 }

// @ts-expect-error: Expected 2 arguments, but got 1.
new Product("Chair");

Writing constructor(): Product is error TS1093 (Type annotation cannot appear on a constructor declaration). Everything else about how new works is plain JavaScript.

Parameter Properties

The pattern above (declare a field, take a parameter, copy it over) is so common that TypeScript has a shorthand. Put public, private, protected or readonly before a constructor parameter and it becomes a field:

class Product {
    constructor(
        public name: string,
        private price: number,
        readonly sku: string,
    ) {}

    label(): string {
        return `${this.name} (${this.sku}): $${this.price}`;
    }
}

const lamp = new Product("Lamp", 39, "LMP-1");
console.log(lamp.label()); // Lamp (LMP-1): $39
console.log(lamp.name, lamp.sku); // Lamp LMP-1
// lamp.price is private: accessing it outside the class is a compile error

This is one of the few TypeScript features that generates code. The compiler writes the assignments for you:

class Product {
    name;
    price;
    sku;
    constructor(name, price, sku) {
        this.name = name;
        this.price = price;
        this.sku = sku;
    }
    // ...
}

Because it is not just erased types, parameter properties do not run under Node's built-in type stripping (node file.ts fails with ERR_UNSUPPORTED_TYPESCRIPT_SYNTAX), and the erasableSyntaxOnly compiler option reports them as error TS1294. Projects that run .ts files directly write the fields out by hand.

Optional and Default Parameters

Constructor parameters follow the same rules as function parameters: ? makes one optional, a default value makes it optional and fills it in, and required parameters come first.

class Logger {
    constructor(
        readonly prefix: string,
        readonly level: "info" | "debug" = "info",
        readonly color?: string,
    ) {}
}

console.log(new Logger("app"));
// Logger { prefix: 'app', level: 'info', color: undefined }
console.log(new Logger("db", "debug", "blue"));
// Logger { prefix: 'db', level: 'debug', color: 'blue' }

Parameter properties can have defaults too. The type of color inside the class is string | undefined, so code that uses it must check for undefined first.

For constructors with many options, one options object reads better than a long positional list: constructor(opts: { prefix: string; level?: "info" | "debug" }).

Field Initialization Order

Field initializers run before the constructor body, and parameter properties are assigned at the start of the constructor body. So a field initializer cannot read a parameter property. TypeScript catches it:

// This does not compile: the initializer reads `size` too early.
class Grid {
    cells = this.size * this.size;

    constructor(public size: number) {}
}

console.log(new Grid(3).cells);

index.ts(3,18): error TS2729: Property 'size' is used before its initialization.
index.ts(3,30): error TS2729: Property 'size' is used before its initialization.

At runtime the initializer would see undefined and produce NaN. Compute the value in the constructor body instead:

class Grid {
    cells: number;

    constructor(public size: number) {
        this.cells = size * size;
    }
}

console.log(new Grid(3).cells); // 9

Constructor Overloads

A class has exactly one constructor implementation, but you can list several overload signatures above it. Callers see only the overloads; the implementation signature must be compatible with all of them.

class Color {
    r: number;
    g: number;
    b: number;

    constructor(hex: string);
    constructor(r: number, g: number, b: number);
    constructor(a: string | number, g = 0, b = 0) {
        if (typeof a === "string") {
            const n = parseInt(a.replace("#", ""), 16);
            this.r = (n >> 16) & 255;
            this.g = (n >> 8) & 255;
            this.b = n & 255;
        } else {
            this.r = a;
            this.g = g;
            this.b = b;
        }
    }
}

console.log(new Color("#ff8800")); // Color { r: 255, g: 136, b: 0 }
console.log(new Color(10, 20, 30)); // Color { r: 10, g: 20, b: 30 }
// new Color(10, 20) is an error: no overload takes 2 arguments

Overloads get hard to read past two or three shapes. Static factory methods with descriptive names (Color.fromHex("#ff8800"), Color.fromRgb(10, 20, 30)) are often clearer and need no type narrowing inside one body.

Calling super in a Subclass

A derived class that declares its own constructor must call super(...) with the parent's arguments, and must do it before touching this. Forgetting the call is error TS2377 (Constructors for derived classes must contain a 'super' call), and using this first is TS17009 ('super' must be called before accessing 'this' in the constructor of a derived class). Both mirror JavaScript runtime rules.

class Animal {
    constructor(public name: string) {}
}

class Dog extends Animal {
    tricks: string[];

    constructor(name: string, ...tricks: string[]) {
        super(name); // must come first
        this.tricks = tricks;
    }
}

const rex = new Dog("Rex", "sit", "roll");
console.log(rex); // Dog { name: 'Rex', tricks: [ 'sit', 'roll' ] }

A subclass that adds no constructor inherits the parent's, with the same parameter types. More on subclasses in inheritance.

Private Constructors and Async Setup

A private constructor can only be called from inside the class. Outside, new is error TS2673. This is how you force callers through a factory, for a singleton or for setup that has to be asynchronous (constructors cannot be async).

class Connection {
    private constructor(readonly url: string, readonly version: number) {}

    static async open(url: string): Promise<Connection> {
        const version = await Promise.resolve(3); // stands in for a real handshake
        return new Connection(url, version);
    }
}

async function main() {
    const conn = await Connection.open("db://local");
    console.log(conn.url, conn.version); // db://local 3
}
main();

private here is a compile-time rule only. The emitted JavaScript has an ordinary constructor, so plain JavaScript code could still call new Connection(...).

Constructor Types

To accept a class as a value, type the parameter with a construct signature: new (...args) => Instance. typeof MyClass also works, but it ties the parameter to that one class's constructor signature and static members.

class Circle {
    constructor(public r: number) {}
}
class Square {
    constructor(public r: number) {}
}

type ShapeCtor<T> = new (size: number) => T;

function makeAll<T>(ctor: ShapeCtor<T>, sizes: number[]): T[] {
    return sizes.map((s) => new ctor(s));
}

console.log(makeAll(Circle, [1, 2])); // [ Circle { r: 1 }, Circle { r: 2 } ]
console.log(makeAll(Square, [5]));    // [ Square { r: 5 } ]

type CircleArgs = ConstructorParameters<typeof Circle>; // [r: number]
const args: CircleArgs = [7];
console.log(new Circle(...args)); // Circle { r: 7 }

ConstructorParameters and InstanceType extract the parameter tuple and the instance type from a constructor type; they are covered with the other function helpers in ReturnType and Parameters.