← Назад ко всем вопросам

В чем разница между типом и интерфейсом в TypeScript

1️⃣ Как кратко ответить

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

2️⃣ Подробное объяснение темы

TypeScript — это надстройка над JavaScript, которая добавляет статическую типизацию. Два основных инструмента для определения типов данных в TypeScript — это интерфейсы (interfaces) и типы (types). Они помогают разработчикам описывать структуру данных, что делает код более предсказуемым и безопасным.

Интерфейсы

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

interface Person {
  name: string; // Свойство name должно быть строкой
  age: number;  // Свойство age должно быть числом
  greet(): void; // Метод greet не принимает аргументов и ничего не возвращает
}
​
const user: Person = {
  name: "Alice",
  age: 30,
  greet() {
    console.log("Hello!");
  }
};
  • interface Person — объявление интерфейса с именем Person.
  • name: string и age: number — обязательные свойства, которые должны присутствовать в объекте, реализующем этот интерфейс.
  • greet(): void — метод, который должен быть реализован в объекте.
  • const user: Person — объект user должен соответствовать интерфейсу Person.

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

interface Employee extends Person {
  employeeId: number; // Новое свойство, специфичное для Employee
}
​
const employee: Employee = {
  name: "Bob",
  age: 25,
  employeeId: 123,
  greet() {
    console.log("Hi!");
  }
};
  • interface Employee extends Person — интерфейс Employee расширяет Person, добавляя новое свойство employeeId.

Типы

Типы в TypeScript более универсальны. Они могут описывать не только объекты, но и примитивы, объединения, пересечения и другие структуры данных.

type Point = {
  x: number; // Свойство x должно быть числом
  y: number; // Свойство y должно быть числом
};
​
const point: Point = {
  x: 10,
  y: 20
};
  • type Point — объявление типа с именем Point.
  • x: number и y: number — обязательные свойства для объектов типа Point.

Типы могут объединять несколько типов в один с помощью объединений и пересечений.

type StringOrNumber = string | number; // Объединение: переменная может быть строкой или числом
​
type Name = { name: string };
type Age = { age: number };
​
type PersonDetails = Name & Age; // Пересечение: объект должен иметь свойства из обоих типов
​
const personDetails: PersonDetails = {
  name: "Charlie",
  age: 40
};
  • type StringOrNumber = string | number — объединение, переменная может быть либо строкой, либо числом.
  • type PersonDetails = Name & Age — пересечение, объект должен содержать свойства из обоих типов Name и Age.

Основные различия

  1. Расширение: Интерфейсы поддерживают декларативное расширение, что позволяет добавлять новые свойства к существующим интерфейсам. Типы не поддерживают декларативное расширение, но могут быть объединены с помощью пересечений.

  2. Универсальность: Типы более универсальны и могут описывать не только объекты, но и примитивы, объединения и пересечения.

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

Понимание различий между типами и интерфейсами позволяет более эффективно использовать TypeScript для создания безопасного и предсказуемого кода.

Тема: TypeScript
Стадия: Tech

🔒 Подпишись на бусти автора и стань Алигатором, чтобы получить полный доступ к функционалу сайта и отслеживать свой прогресс!

Твои заметки