Що таке Utility Types у TypeScript?

TypeScriptJunior~2 хв читання

Utility Types - це вбудовані (готові) утилітарні типи TypeScript, які допомагають швидко створювати, змінювати або комбінувати типи, не прописуючи всю структуру вручну.

Вони дозволяють "трансформувати" наявні типи - роблячи властивості optional, readonly, виключаючи поля, вибираючи підмножини тощо.

1. Що таке Utility Types

Utility Types - це спеціальні generic-типи, вбудовані в TypeScript, які виконують типові операції над іншими типами.

Приклад ідеї:

javascript

interface User {
  id: number;
  name: string;
  age?: number;
}

type ReadonlyUser = Readonly<User>;

ReadonlyUser - це той самий User, але з усіма властивостями readonly.

2. Найпопулярніші Utility Types

Утиліта	Що робить	Приклад
`Partial<T>`	Робить усі поля типу `T` необов'язковими	`Partial<User>`
`Required<T>`	Робить усі поля обов'язковими	`Required<User>`
`Readonly<T>`	Робить усі поля тільки для читання	`Readonly<User>`
`Pick<T, K>`	Вибирає лише вказані поля з типу	`Pick<User, 'id'
`Omit<T, K>`	Виключає вказані поля з типу	`Omit<User, 'age'>`
`Record<K, V>`	Створює об'єкт з ключами `K` і значеннями `V`	`Record<string, number>`
`Exclude<T, U>`	Виключає з `T` усі типи, сумісні з `U`	`Exclude<'a'
`Extract<T, U>`	Залишає лише типи з `T`, сумісні з `U`	`Extract<'a'
`NonNullable<T>`	Прибирає `null` і `undefined`	`NonNullable<string
`ReturnType<F>`	Отримує тип значення, яке повертає функція	`ReturnType<() => string>` → `string`
`Parameters<F>`	Отримує типи параметрів функції	`Parameters<(a:number,b:string)=>void>` → `[number,string]`
`InstanceType<C>`	Тип екземпляра класу	`InstanceType<typeof User>`

3. Приклади використання

`Partial<T>`

Робить усі властивості необов'язковими.

javascript

interface User {
  id: number;
  name: string;
  age: number;
}

const updateUser = (user: Partial<User>) => {
  // можна передати лише потрібні поля
};

updateUser({ name: "Тім" }); // ok

`Required<T>`

Зворотний до Partial - робить усі поля обов'язковими.

javascript

interface Options {
  debug?: boolean;
  cache?: boolean;
}

type StrictOptions = Required<Options>;

const opts: StrictOptions = {
  debug: true,
  cache: false, // тепер обов'язково
};

`Readonly<T>`

Забороняє змінювати властивості.

javascript

interface Config {
  port: number;
  host: string;
}

const cfg: Readonly<Config> = { port: 3000, host: "localhost" };

cfg.port = 8080; // Помилка: readonly

`Pick<T, K>`

Створює тип лише з указаними полями.

javascript

interface User {
  id: number;
  name: string;
  email: string;
}

type UserPreview = Pick<User, "id" | "name">;

const u: UserPreview = { id: 1, name: "Тім" };

`Omit<T, K>`

Створює тип без указаних полів.

javascript

type UserWithoutEmail = Omit<User, "email">;

const u: UserWithoutEmail = { id: 1, name: "Тім" };

`Record<K, V>`

Створює об'єкт з ключами K і значеннями V.

javascript

type Roles = Record<string, number>;

const userRoles: Roles = {
  admin: 1,
  user: 2,
};

Дуже зручно для типізації словників і enum-подібних структур.

`Exclude<T, U>`

Видаляє підтипи з union.

javascript

type Letters = "a" | "b" | "c";
type NoA = Exclude<Letters, "a">; // "b" | "c"

`Extract<T, U>`

Залишає лише спільні типи.

javascript

type Letters = "a" | "b" | "c";
type OnlyA = Extract<Letters, "a" | "x">; // "a"

`NonNullable<T>`

Прибирає null і undefined.

javascript

type MaybeString = string | null | undefined;
type DefinitelyString = NonNullable<MaybeString>; // string

`ReturnType<F>`

Отримує тип значення, яке повертає функція.

javascript

function getUser() {
  return { id: 1, name: "Тім" };
}

type UserType = ReturnType<typeof getUser>;
// { id: number; name: string }

`Parameters<F>`

Отримує типи параметрів функції у вигляді кортежу.

javascript

function multiply(a: number, b: number): number {
  return a * b;
}

type Args = Parameters<typeof multiply>; // [number, number]

`InstanceType<C>`

Отримує тип екземпляра класу.

javascript

class Person {
  name = "Тім";
}

type PersonInstance = InstanceType<typeof Person>;

const user: PersonInstance = new Person();

4. Комбінування Utility Types

Утиліти легко комбінувати між собою:

javascript

interface User {
  id: number;
  name: string;
  email?: string;
}

type SafeUser = Readonly<Partial<User>>;
// усі поля необов'язкові і readonly

5. Свій Utility Type (кастомний)

Можна створювати власні утиліти за допомогою mapped types і keyof:

javascript

type Nullable<T> = {
  [K in keyof T]: T[K] | null;
};

type UserWithNulls = Nullable<User>;

Тепер кожне поле User може бути null.

Підсумок

Utility Types - це вбудовані інструменти TypeScript для "трансформації" і "модифікації" типів без дублювання коду.

Основні групи:

модифікація властивостей (Partial, Required, Readonly);
вибір і виключення полів (Pick, Omit);
створення колекцій (Record);
операції з union (Exclude, Extract, NonNullable);
робота з функціями (ReturnType, Parameters);
класи (InstanceType).

Коротка відповідь

Для співбесіди

Premium

Коротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.