логотип PurpleSchool
логотип PurpleSchool

Расширение типов в TypeScript

Автор

Дмитрий Нечаев

В TypeScript часто возникает необходимость создавать типы, которые являются более специфичными версиями других типов. Это может быть особенно полезно, когда мы хотим избежать повторения кода и упростить поддержку и расширение программных интерфейсов.

Базовый пример

Рассмотрим простой пример с адресами. Мы начнем с базового типа BasicAddress, который описывает необходимые поля для отправки писем и посылок в США:

interface BasicAddress {
  name?: string;
  street: string;
  city: string;
  country: string;
  postalCode: string;
}

Этот тип описывает базовую структуру адреса, но в реальной жизни адреса часто содержат дополнительные детали. Например, если здание имеет несколько подразделений, может потребоваться указать номер квартиры или офиса.

Расширение типов позволяет создавать новые типы на основе существующих, добавляя или изменяя их свойства. Чтобы уверенно использовать расширение типов и создавать надежный код, необходимо глубокое понимание системы типов TypeScript. Приходите на наш большой курс TypeScript с нуля. На курсе 192 уроков и 17 упражнений, AI-тренажеры для безлимитной практики с кодом и задачами 24/7, решение задач с живым ревью наставника, еженедельные встречи с менторами.

Расширение типов

Для описания адреса с единицей измерения (например, номером квартиры) мы можем расширить BasicAddress, создав новый тип AddressWithUnit:

interface AddressWithUnit extends BasicAddress {
  unit: string;
}

Здесь ключевое слово extends позволяет нам включить все свойства BasicAddress в новый тип AddressWithUnit, добавляя только уникальные поля. Это избавляет нас от необходимости повторять все поля базового типа.

Преимущества подхода

Использование расширения типов снижает объем кода и повышает его читаемость. Кроме того, это упрощает поддержку кода, поскольку любые изменения в базовом типе автоматически отражаются во всех расширенных типах. Это делает код более модульным и легким для масштабирования.

Расширение нескольких типов

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

interface Colorful {
  color: string;
}

interface Circle {
  radius: number;
}

interface ColorfulCircle extends Colorful, Circle {}

Здесь ColorfulCircle сочетает свойства Colorful и Circle, позволяя создавать объекты, которые имеют как цвет, так и радиус:

const cc: ColorfulCircle = {
  color: "red",
  radius: 42,
};

Заключение

Расширение типов в TypeScript — это мощный инструмент для создания чистого и удобно масштабируемого кода. Оно позволяет легко добавлять новые функции, при этом сохраняя связь с базовыми абстракциями, что делает код более устойчивым к изменениям и ошибкам.

Правильное использование расширения типов может значительно упростить разработку и поддержку сложных приложений. На нашем курсе TypeScript с нуля вы получите все необходимые знания и навыки для работы с типами в TypeScript. В первых 3 модулях уже доступно бесплатное содержание — начните погружаться в TypeScript прямо сегодня.

Стрелочка влевоСигнатуры индекса в TypeScriptПроверка избыточных свойств в TypeScriptСтрелочка вправо

Постройте личный план изучения Typescript до уровня Middle — бесплатно!

Typescript — часть карты развития Frontend

  • step100+ шагов развития
  • lessons30 бесплатных лекций
  • lessons300 бонусных рублей на счет

Бесплатные лекции

Все гайды по Typescript

Открыть базу знаний

Лучшие курсы по теме

изображение курса

TypeScript с нуля

Антон Ларичев
AI-тренажеры
Практика в студии
Гарантия
Бонусы
иконка звёздочки рейтинга4.7
3 999 ₽ 6 990 ₽
Подробнее
изображение курса

CSS Flexbox

Антон Ларичев
Гарантия
Бонусы
иконка звёздочки рейтинга4.9
бесплатно
Подробнее
изображение курса

Next.js - с нуля

Антон Ларичев
AI-тренажеры
Практика в студии
Гарантия
Бонусы
иконка звёздочки рейтинга4.7
3 999 ₽ 6 990 ₽
Подробнее

Отправить комментарий