Типизация объектов

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

Литералы объектов как типы

Простейший способ описать объект — использовать литерал типа прямо в аннотации. Указываются имена свойств и их типы через двоеточие.

const user: { name: string; age: number } = {
  name: "Алексей",
  age: 25
};

Такой подход работает для разовых случаев, но имеет существенный недостаток — литерал нельзя переиспользовать. Если нужно описать несколько объектов с одинаковой структурой, приходится копировать одно и то же описание.

Проблема повторного использования

Представьте, что в приложении нужно работать с несколькими пользователями. Каждый раз писать { name: string; age: number } неудобно и приводит к дублированию кода. Для решения этой проблемы в TypeScript существуют два механизма — interface и type.

Interface — определение формы объекта

Ключевое слово interface создаёт именованный контракт, описывающий структуру объекта. Это наиболее распространённый способ типизации объектов в TypeScript.

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

const user1: User = {
  name: "Мария",
  email: "maria@example.com",
  age: 30
};

const user2: User = {
  name: "Иван",
  email: "ivan@example.com",
  age: 28
};

Расширение интерфейсов

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

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

interface Admin extends User {
  role: string;
  permissions: string[];
}

const admin: Admin = {
  name: "Администратор",
  email: "admin@site.com",
  role: "superuser",
  permissions: ["read", "write", "delete"]
};

Type — алиас для любого типа

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

type User = {
  name: string;
  email: string;
  age: number;
};

const user: User = {
  name: "Елена",
  email: "elena@example.com",
  age: 22
};

Type может описывать не только объекты:

type ID = string;
type Status = "active" | "inactive";
type Point = [number, number];

Когда использовать interface, а когда type

Оба подхода позволяют описывать объекты, но есть рекомендации по выбору.

Используйте interface, когда:

Описываете форму объекта или класса
Планируете расширять тип через наследование
Работаете с пропсами компонентов в React

Используйте type, когда:

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

В большинстве случаев для описания объектов данных предпочтительнее interface, так как он был создан специально для этой цели и поддерживает расширение.