Утилітний тип readonly у TypeScript

Readonly — це утилітний тип у TypeScript, який робить всі пропси типу тільки для читання. Після того, як властивість стає readonly, її не можна змінити через пряме присвоєння в коді, що допомагає уникнути ненавмисних мутацій об'єктів.

Синтаксис

typescript

Readonly<T>

T — оригінальний тип, пропси якого ви хочете зробити незмінними.

Тип Readonly найчастіше використовується для захисту об'єктів від небажаних змін, зберігаючи доступ до їх властивостей для читання.

Коли використовувати Readonly?

Якщо об'єкт не повинен змінюватися після створення.
Для роботи з постійними об'єктами.
При передачі даних у функцію, щоб уникнути випадкових змін.

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

Створення об'єкта з незмінними властивостями:

interface User {
      id: number;
      name: string;
    }
    
    type ReadonlyUser = Readonly<User>;
    
    const user: ReadonlyUser = {
      id: 1,
      name: "Alice",
    };
    
    user.name = "Bob"; 
    // Error: Cannot assign to 'name' because it is a read-only property`

Тут ReadonlyUser перетворює всі пропси (id та name) на readonly.
Спроба змінити будь-яку властивість призводить до помилки компіляції.

Приклад для незмінних конфігурацій:

Іноді потрібно зафіксувати налаштування, щоб їх не можна було змінити після ініціалізації:

interface Config {
    readonly port: number;  // Вже явно встановлено
    dbName: string;
}

// Використання Readonly робить всі поля тільки для читання
type FullReadonlyConfig = Readonly<Config>;

const config: FullReadonlyConfig = {
    port: 8080,
    dbName: "mainDB",
};

config.dbName = "testDB"; 
// Error: 'dbName' is read-only`

Поле port має readonly, але також dbName стає readonly, коли ми обгортаємо весь інтерфейс у Readonly<Config>.

Використання у функціях

Гарантування незмінності аргументів

Можна оголосити параметри функції як Readonly<T>, щоб запобігти випадковим змінам переданого об'єкта:

function printUser(user: Readonly<User>) {
    // user.id = 42;   // Error
    console.log(user.id, user.name);
}

Це захищає від мутацій об'єктів всередині функції.

Підсумок

Readonly — це зручний спосіб захистити пропси об'єкта від змін.
Застосовується, коли ви хочете явно вказати, що об'єкт повинен залишатися незмінним протягом використання.
Коли ви намагаєтеся присвоїти щось пропси readonly, TypeScript викине помилку на етапі компіляції, допомагаючи уникнути ненавмисних мутацій.

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

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

Premium

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

Дочитали статтю?

Практика завдань

Утилітний тип readonly у TypeScript

#Синтаксис

#Коли використовувати Readonly?

#Приклад використання Readonly

#Використання у функціях