Podstawy•LEKCJA 14 / 26

Extends w interfejsach

Kurs TypeScript · Wyjaśnienie, przykłady, oczekiwany wynik i ćwiczenie.

Interfejs może rozszerzyć inny interfejs przez extends.

Cel lekcji

Poznać zagadnienie „Extends w interfejsach”, zrozumieć przykład i umieć zastosować podobny zapis we własnym programie.

Wyjaśnienie krok po kroku

Pozwala to opisać wspólne pola w jednym miejscu zamiast kopiować ten sam kod.

Najpierw przeanalizuj kod bez uruchamiania. Zwróć uwagę, jakie dane wykorzystuje program, co z nimi robi i skąd bierze się wynik pokazany pod przykładem.

Praktyczny przykład

Gdzie zobaczysz efekt: Po kompilacji i wykonaniu JavaScript

interface User { name: string }
interface Admin extends User { role: "admin" }
const a: Admin = { name: "Ada", role: "admin" };
console.log(a.name);

Przeczytaj kod linijka po linijce

  1. interface User { name: string }Definiujemy nowy typ obiektu lub umowę dotyczącą jego zachowania.
  2. interface Admin extends User { role: "admin" }Definiujemy nowy typ obiektu lub umowę dotyczącą jego zachowania.
  3. const a: Admin = { name: "Ada", role: "admin" };Tworzymy lub aktualizujemy zmienną, pole albo przypisanie.
Oczekiwany wynik / efektpo uruchomieniu przykładu
Ada

Jak utrwalić tę umiejętność?

Przepisz kod samodzielnie. Następnie zmień jedną wartość lub jedną instrukcję i spróbuj przewidzieć efekt. Dopiero potem uruchom zmienioną wersję. Jeśli wynik jest inny niż oczekiwany, porównaj kolejne linie.

Spróbuj samodzielnie

Dodaj pole permissions: string[] do Admin.

To już koniec tej lekcji.

Jeśli rozumiesz przykład, oznacz lekcję jako ukończoną i przejdź dalej.