Alias typu vs Interfejs

W TypeScript możemy definiować strukturę złożonych obiektów na dwa główne sposoby: za pomocą Interfejsów (interface) lub Aliasów Typów (type). Oba służą do opisywania "kształtu" obiektu lub struktury danych, lecz mają kilka kluczowych różnic.

Interfejsy (interface)

Interfejs definiuje kontrakt dla struktury obiektu. Jest standardowym narzędziem służącym do opisywania kształtu obiektów i API w sposób rozszerzalny.

interface Book {
  title: string;
  pages: number;
  author?: string; // Proprietà opzionale (può essere omessa)
}

const myBook: Book = {
  title: 'Il Signore degli Anelli',
  pages: 1200,
};

Znak zapytania (?) oznacza właściwość jako opcjonalną. Obiekt myBook jest poprawny nawet wtedy, gdy pomija właściwość author.

Aliasy Typów (type)

Alias typu pozwala na przypisanie nowej nazwy do dowolnego istniejącego typu, w tym do typów prymitywnych, unii, krotek lub całych struktur obiektów.

type Point = {
  x: number;
  y: number;
};

const coordinates: Point = { x: 10, y: 20 };

Kluczowe różnice: Rozszerzanie oraz Declaration Merging

Choć interface i type są w większości przypadków stosowane zamiennie, to mają dwie zasadnicze różnice:

1. Rozszerzalność (Dziedziczenie)

Interfejsy rozszerza się za pomocą słowa kluczowego extends:

interface User {
  username: string;
}

interface Admin extends User {
  privileges: string[];
}

Aliasy typów nie mogą być rozszerzane za pomocą extends, lecz można je łączyć ze sobą za pomocą przecięcia / iloczynu typów (&):

type User = {
  username: string;
};

type Admin = User & {
  privileges: string[];
};

2. Declaration Merging (Scalanie Deklaracji)

Wiele interfejsów o tej samej nazwie w tym samym zakresie (scope) jest automatycznie scalanych przez kompilator:

interface User {
  name: string;
}
interface User {
  email: string;
}
// Ora User ha sia 'name' che 'email'!

To zachowanie nie jest obsługiwane przez aliasy typów: ponowne zadeklarowanie tej samej nazwy type wywoła błąd kompilacji.

Spróbuj sam

Ćwiczenie 1: Interfejs Użytkownik

Ćwiczenie 2: Alias typu Point2D

Ćwiczenie 3: Rozszerzanie Interfejsów

Ćwiczenie 4: Konfiguracja Serwera