0Pricing
TypeScript Academy · Lekcja

TypeScript 5.1–5.2: ulepszone wnioskowanie

Poznaj niezależność typów setterów i getterów oraz deklaracje using.

TypeScript 5.1–5.2: ulepszone wnioskowanie to bezpłatna lekcja TypeScript Academy na CoddyKit. To lekcja 2 z 4. Możesz przeczytać całą lekcję poniżej za darmo — a potem ćwiczyć ją interaktywnie w przeglądarce z wbudowanym edytorem kodu i tutorem AI dostępnym 24/7. To część ścieżki edukacyjnej TypeScript Academy, a Twój postęp synchronizuje się między webem a aplikacją CoddyKit. Kurs TypeScript Academy zawiera 4 lekcji w sumie.

Przegląd TypeScript 5.1

TypeScript 5.1, wydany w czerwcu 2023 roku, poprawił niezależność typów setterów i getterów, elastyczność typów elementów JSX, powiązane kursory w edytorach oraz optymalizacje wydajności.

// npm install typescript@5.1

Niezależność typów setterów i getterów

Przed wersją 5.1 setter i getter musiały używać tego samego typu. Teraz getter może zwracać typ szerszy niż typ akceptowany przez setter — jest to przydatne we wzorcach konwersji typów.

class Temperature {
  get celsius(): string { return this._c + "°C"; } // string
  set celsius(value: string | number) {             // string | number
    this._c = Number(value);
  }
  private _c = 0;
}

undefined jako elementy JSX

TS 5.1 pozwala komponentom zwracać bezpośrednio undefined (oprócz null) z funkcji renderującej, zgodnie z zachowaniem React 18.

// TS 5.1+: OK
function Widget(): undefined { return undefined; }
// Before 5.1: had to return null or JSX element

Elastyczność typu elementu JSX

Nowe ograniczenie JSX.ElementType zapewnia większą elastyczność niestandardowym fabrykom JSX, co jest przydatne w środowiskach innych niż React.

// Custom JSX element types supported more naturally in 5.1

Przegląd TypeScript 5.2

TypeScript 5.2 (wydany w sierpniu 2023 roku) wprowadził deklaracje using (jawne zarządzanie zasobami), metadane dekoratorów oraz metody kopiowania tablic.

// npm install typescript@5.2

Deklaracje using

using implementuje propozycję jawnego zarządzania zasobami — metoda [Symbol.dispose]() zasobu jest wywoływana, gdy zasób wychodzi poza zakres.

// Requires lib: ["es2022", "esnext.disposable"]
function getConnection(): Disposable {
  const conn = openDb();
  return { [Symbol.dispose]() { conn.close(); } };
}

{
  using conn = getConnection();
  // conn.close() called automatically at block end
}

await using do asynchronicznego zwalniania zasobów

await using działa podobnie jak using, ale wywołuje asynchroniczną metodę [Symbol.asyncDispose](), umożliwiając asynchroniczne zwalnianie zasobów.

async function run() {
  await using db = await connectDb();
  // db[Symbol.asyncDispose]() called on exit
}

Metadane dekoratorów

TS 5.2 implementuje propozycję metadanych dekoratorów TC39, umożliwiając dekoratorom dołączanie metadanych za pomocą Symbol.metadata.

function meta(value: string) {
  return (_: unknown, ctx: DecoratorContext) => {
    ctx.metadata[ctx.name] = value;
  };
}

@meta("service")
class MyService {}
console.log((MyService as any)[Symbol.metadata]); // { "MyService": "service" }

Metody kopiowania tablic

TS 5.2 dodał typy dla elementów Array.prototype.toSorted, toReversed, toSpliced i with — niemutowalnych operacji na tablicach z ES2023.

const arr = [3, 1, 2];
const sorted = arr.toSorted(); // [1, 2, 3] — new array, arr unchanged
const reversed = arr.toReversed(); // [2, 1, 3]

using w tsconfig dla wersji 5.2

Aby używać deklaracji using, należy uwzględnić bibliotekę esnext.disposable w pliku tsconfig.

{
  "compilerOptions": {
    "target": "ES2022",
    "lib": ["ES2022", "ESNext.Disposable"]
  }
}

Podsumowanie: TS 5.1–5.2

TS 5.1: niezależne typy getterów i setterów oraz zwracanie undefined przez JSX. TS 5.2: deklaracje using do automatycznego zwalniania zasobów, metadane dekoratorów oraz typy niemutowalnych metod kopiowania tablic.

Szybkie sprawdzenie

Co robi deklaracja using w TypeScript 5.2?

Czego się Państwo nauczyli

TS 5.1 wprowadził niezależne typy getterów i setterów oraz zwracanie undefined przez JSX. TS 5.2 wprowadził deklaracje using do automatycznego zarządzania zasobami, metadane dekoratorów oraz typy niemutowalnych metod tablic z ES2023.

Często zadawane pytania

Czy lekcja „TypeScript 5.1–5.2: ulepszone wnioskowanie” jest bezpłatna?

Tak — pełny tekst „TypeScript 5.1–5.2: ulepszone wnioskowanie” jest dostępny za darmo tutaj w sieci. Aby ćwiczyć ją interaktywnie (wbudowany edytor kodu i tutor AI dostępny 24/7) i odblokować resztę kursu TypeScript Academy, przejdź na CoddyKit PRO. Kurs TypeScript Academy zawiera 4 lekcji w sumie.

Co nauczysz się w „TypeScript 5.1–5.2: ulepszone wnioskowanie”?

Poznaj niezależność typów setterów i getterów oraz deklaracje using. Ćwiczysz TypeScript Academy z praktycznym kodem, który uruchamiasz bezpośrednio w przeglądarce, a tutor AI dostępny 24/7 odpowiada na Twoje pytania podczas pracy nad lekcją.

Czy potrzebuję doświadczenia, aby zacząć TypeScript Academy?

Nie wymagamy żadnego doświadczenia. TypeScript Academy w CoddyKit jest strukturyzowany dla początkujących i zaawansowanych użytkowników, więc możesz zacząć tutaj lub od początku i uczyć się w swoim tempie. To lekcja 2 z 4.

Ile czasu zajmuje lekcja „TypeScript 5.1–5.2: ulepszone wnioskowanie”?

Większość lekcji CoddyKit trwa około 5–10 minut. Każda lekcja to mały, interaktywny krok, dzięki czemu robisz systematyczne postępy i zawsze wracasz dokładnie do tego samego miejsca — na webie i w aplikacji.

Czy mogę pisać i uruchamiać kod w tej lekcji TypeScript Academy?

Tak. Każda lekcja TypeScript Academy zawiera wbudowany edytor kodu, więc piszesz i uruchamiasz prawdziwy kod bezpośrednio w przeglądarce i od razu otrzymujesz sprzężenie zwrotne od AI — bez konfiguracji na komputerze.

Wszystkie lekcje w tym kursie

  1. TypeScript 5.0: standard dekoratorów i parametry typów const
  2. TypeScript 5.1–5.2: ulepszone wnioskowanie
  3. TypeScript 5.3–5.4: nowe zawężanie i NoInfer
  4. TypeScript 5.5+: izolowane deklaracje i dalsze zmiany
← Powrót do TypeScript Academy