Конструктор в TypeScript: свойства-параметры и перегрузки

Конструктор в TypeScript это метод constructor класса с типизированными параметрами. У него нет аннотации типа возврата: он всегда создаёт экземпляр класса.

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");

Запись constructor(): Product это ошибка TS1093 (Type annotation cannot appear on a constructor declaration). Всё остальное в работе new это обычный JavaScript.

Свойства-параметры

Приём выше (объявить поле, принять параметр, скопировать его) настолько распространён, что в TypeScript есть сокращение. Поставьте public, private, protected или readonly перед параметром конструктора, и он станет полем:

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

Это одна из немногих возможностей TypeScript, которая генерирует код. Компилятор пишет присваивания за вас:

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

Поскольку это не просто стираемые типы, свойства-параметры не работают при встроенном удалении типов в Node (node file.ts падает с ERR_UNSUPPORTED_TYPESCRIPT_SYNTAX), а параметр компилятора erasableSyntaxOnly сообщает о них как об ошибке TS1294. Проекты, которые запускают файлы .ts напрямую, выписывают поля вручную.

Необязательные параметры и значения по умолчанию

Параметры конструктора подчиняются тем же правилам, что и параметры функций: ? делает параметр необязательным, значение по умолчанию делает его необязательным и подставляет значение, а обязательные параметры идут первыми.

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' }

У свойств-параметров тоже могут быть значения по умолчанию. Внутри класса color имеет тип string | undefined, поэтому код, который его использует, должен сначала проверить на undefined.

Для конструкторов с большим числом параметров один объект параметров читается лучше длинного позиционного списка: constructor(opts: { prefix: string; level?: "info" | "debug" }).

Порядок инициализации полей

Инициализаторы полей выполняются до тела конструктора, а свойства-параметры присваиваются в начале тела конструктора. Поэтому инициализатор поля не может прочитать свойство-параметр. TypeScript это ловит:

// 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.

Во время выполнения инициализатор увидел бы undefined и дал бы NaN. Вычисляйте значение в теле конструктора:

class Grid {
    cells: number;

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

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

Перегрузки конструктора

У класса ровно одна реализация конструктора, но над ней можно перечислить несколько сигнатур перегрузки. Вызывающий код видит только перегрузки; сигнатура реализации должна быть совместима со всеми ними.

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

Перегрузки становится трудно читать после двух-трёх форм. Статические фабричные методы с понятными именами (Color.fromHex("#ff8800"), Color.fromRgb(10, 20, 30)) часто понятнее и не требуют сужения типов внутри одного тела.

Вызов super в подклассе

Производный класс, который объявляет собственный конструктор, должен вызвать super(...) с аргументами родителя, и сделать это до обращения к this. Забытый вызов это ошибка TS2377 (Constructors for derived classes must contain a 'super' call), а использование this до вызова это TS17009 ('super' must be called before accessing 'this' in the constructor of a derived class). Обе ошибки отражают правила JavaScript во время выполнения.

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' ] }

Подкласс, который не добавляет конструктора, наследует конструктор родителя с теми же типами параметров. Подробнее о подклассах в разделе наследование.

Приватные конструкторы и асинхронная настройка

Конструктор private можно вызвать только изнутри класса. Снаружи new это ошибка TS2673. Так вызывающий код направляют через фабрику: для синглтона или для настройки, которая должна быть асинхронной (конструкторы не могут быть 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 здесь это правило только времени компиляции. В сгенерированном JavaScript обычный конструктор, так что обычный код на JavaScript всё равно может вызвать new Connection(...).

Типы конструкторов

Чтобы принимать класс как значение, типизируйте параметр сигнатурой конструктора: new (...args) => Instance. typeof MyClass тоже работает, но привязывает параметр к сигнатуре конструктора и статическим членам именно этого класса.

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 и InstanceType извлекают кортеж параметров и тип экземпляра из типа конструктора; они описаны вместе с другими служебными типами для функций в разделе ReturnType и Parameters.