0Pricing
TypeScript Academy · Lekcja

Zaawansowane zawężanie typów

Dowiedz się, jak używać zaawansowanych strażników typów i analizy przepływu sterowania do łatwej obsługi złożonych warunków typów

Zaawansowane zawężanie typów to bezpłatna lekcja TypeScript Academy na CoddyKit. To lekcja 1 z 3. 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 3 lekcji w sumie.

Wprowadzenie do zaawansowanego zawężania typów

Wprowadzenie do zaawansowanego zawężania typów

Zaawansowane zawężanie typów umożliwia doprecyzowywanie złożonych typów w czasie wykonywania za pomocą zaawansowanych technik, takich jak strażniki typów, analiza przepływu sterowania i niestandardowe predykaty.

Narzędzia te sprawiają, że kod TypeScript jest bezpieczniejszy i bardziej przewidywalny.

Zaawansowane zawężanie typów — ilustracja 1

Czym jest zawężanie typów?

Czym jest zawężanie typów?

Zawężanie typów to proces przekształcania szerszego typu (np. string | number) w bardziej szczegółowy typ za pomocą sprawdzeń wykonywanych w czasie działania programu.

Używanie <code>typeof</code> do zawężania typów

Używanie typeof do zawężania typów

Operator typeof może służyć do zawężania typów prymitywnych:

function printValue(value: string | number): void {
  if (typeof value === 'string') {
    console.log(`String: ${value}`);
  } else {
    console.log(`Number: ${value}`);
  }
}

printValue('Hello'); // String: Hello
printValue(42); // Number: 42

Używanie <code>instanceof</code> do zawężania typów

Używanie instanceof do zawężania typów

Operator instanceof może służyć do zawężania typów instancji klas:

class Dog {
  bark() {
    console.log('Woof!');
  }
}

class Cat {
  meow() {
    console.log('Meow!');
  }
}

function makeSound(animal: Dog | Cat): void {
  if (animal instanceof Dog) {
    animal.bark();
  } else {
    animal.meow();
  }
}

makeSound(new Dog()); // Woof!
makeSound(new Cat()); // Meow!

Używanie własnych strażników typów

Używanie własnych strażników typów

Można tworzyć własne funkcje strażników typów, aby precyzyjniej zawężać typy:

type Fish = { swim: () => void };
type Bird = { fly: () => void };

declare const animal: Fish | Bird;

function isFish(animal: Fish | Bird): animal is Fish {
  return (animal as Fish).swim !== undefined;
}

if (isFish(animal)) {
  animal.swim();
} else {
  animal.fly();

Analiza przepływu sterowania

Analiza przepływu sterowania

Analiza przepływu sterowania w TypeScript automatycznie zawęża typy na podstawie logicznego przebiegu kodu:

function getLength(value: string | string[]): number {
  if (Array.isArray(value)) {
    return value.length;
  } else {
    return value.length;
  }
}

console.log(getLength('Hello')); // 5
console.log(getLength(['a', 'b', 'c'])); // 3

Zalety zaawansowanego zawężania typów

Zalety zaawansowanego zawężania typów

Zaawansowane zawężanie typów usprawnia kod poprzez:

  • Ograniczenie liczby błędów w czasie działania programu.
  • Zwiększenie bezpieczeństwa i czytelności kodu.
  • Zapewnienie precyzyjnej kontroli nad obsługą typów.

Zadanie praktyczne

Zadanie praktyczne

Proszę utworzyć funkcję, która przyjmuje parametr typu string | number i loguje inny komunikat dla każdego typu. Proszę użyć typeof do zaimplementowania tej logiki.

Gratulacje!

Gratulacje!

Nauczyli się Państwo używać zaawansowanych technik zawężania typów w TypeScript do bezpiecznego i skutecznego doprecyzowywania złożonych typów oraz obsługiwania ich. Proszę ćwiczyć te techniki, aby tworzyć bardziej niezawodny kod z bezpiecznym typowaniem!

Zaawansowane zawężanie typów — ilustracja 10

Często zadawane pytania

Czy lekcja „Zaawansowane zawężanie typów” jest bezpłatna?

Tak — pełny tekst „Zaawansowane zawężanie typów” 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 3 lekcji w sumie.

Co nauczysz się w „Zaawansowane zawężanie typów”?

Dowiedz się, jak używać zaawansowanych strażników typów i analizy przepływu sterowania do łatwej obsługi złożonych warunków typów Ć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 1 z 3.

Ile czasu zajmuje lekcja „Zaawansowane zawężanie typów”?

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. Zaawansowane zawężanie typów
  2. Zaawansowane funkcje klas
  3. Typy warunkowe
← Powrót do TypeScript Academy