Перейти до основного вмісту
Модуль 7 · Урок 2 із 214/14 у курсі~15 min
Модульні уроки (2/2)

Оголошення та злиття

Файли декларації типу (з розширенням .d.ts) використовуються в TypeScript для опису форми існуючого коду JavaScript без реалізації будь-якої фактичної логіки. Вони містять лише визначення типів, інтерфейси та сигнатури функцій.

Ці файли необхідні при використанні сторонніх бібліотек, написаних чистим JavaScript.


Злиття декларацій

Об’єднання декларацій — це поведінка, за якої компілятор об’єднує дві або більше окремих декларацій, оголошених з однаковою назвою, в одне визначення.

Найпоширенішим випадком є ​​злиття інтерфейсу:

TS
interface User {
  name: string;
}

interface User {
  age: number;
}

// The resulting User interface has both name and age properties!
const student: User = {
  name: 'Alice',
  age: 23,
};

Якщо властивості мають однакові назви, вони мають бути одного типу, інакше TypeScript повідомить про помилку.


Зміна глобальних і зовнішніх модулів

Ми можемо використовувати злиття декларацій для розширення інтерфейсів, визначених в інших модулях або в глобальній області видимості.

Наприклад, якщо ми хочемо додати властивість до глобального об’єкта браузера window:

TS
declare global {
  interface Window {
    analyticsToken: string;
  }
}

Використовуючи declare global, ми повідомляємо TypeScript, що вставляємо новий підпис в існуючий глобальний інтерфейс Window.


Спробуйте самі

Вправа 1: Об’єднання базових декларацій

вправи#ts.m7.l2.e1
Спроби: 0Завантаження…

У TypeScript інтерфейси з однаковою назвою в одній області автоматично об’єднуються. Оголошіть користувача інтерфейсу з назвою властивості: рядок, а потім у другому блоці оголосите той самий користувач інтерфейсу, додавши властивість age: number. Нарешті, оголосите постійного користувача типу User із відповідними значеннями.

Завантаження редактора…
Показати підказку

Двічі оголосите інтерфейс користувача, вставивши відповідні властивості, а потім призначте поля об’єкту користувача.

Рішення доступне після 3 спроб

Вправа 2: Розширення інтерфейсу глобального вікна

вправи#ts.m7.l2.e2
Спроби: 0Завантаження…

Уявіть, що ви хочете розширити глобальний інтерфейс Window, щоб додати спеціальну властивість під назвою config типу Record<string, string>. Напишіть правильну декларацію за допомогою declare global, щоб об’єднати нову властивість із глобальним інтерфейсом Window.

Завантаження редактора…
Показати підказку

Використовуйте declare global {interface Window { config: Record<string, string>; } }.

Рішення доступне після 3 спроб