0Pricing
TypeScript Academy · Lekcja

Operator typu typeof

Pobieraj typ wartości w czasie wykonywania za pomocą typeof

Operator typu typeof to bezpłatna lekcja TypeScript Academy na CoddyKit. To lekcja 1 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.

Typy na podstawie wartości

Operator typów typeof wyprowadza typ statyczny z wartości działającej w czasie wykonywania programu. Pozwala zapisać wartość raz i ponownie wykorzystać jej strukturę jako typ, utrzymując je w pełnej zgodności.

Dwa różne zastosowania typeof

Nie należy ich mylić: element JavaScriptu typeof zwraca w czasie działania programu napis, natomiast element TypeScriptu typeof występuje w pozycji typu i tworzy typ. To samo słowo kluczowe, ale dwa różne światy.

const n = 42
console.log(typeof n) // "number" — JS runtime
type T = typeof n     // number — TS type position

Przechwytywanie typu zmiennej

Umieść typeof przed wartością w adnotacji typu, aby przechwycić wywnioskowany typ tej wartości. W tym przypadku T staje się typem string.

const greeting = "hello"
type G = typeof greeting // string
const another: G = "world"
console.log(another)

Przechwytywanie struktury obiektu

Zastosowanie typeof do obiektu const zwraca jego pełną wywnioskowaną strukturę — nie trzeba ręcznie zapisywać interfejsu.

const config = { host: "localhost", port: 8080 }
type Config = typeof config // { host: string; port: number }
const c: Config = { host: "127.0.0.1", port: 3000 }
console.log(c)

Inferencja domyślnie poszerza typy

Bez dodatkowych wskazówek TypeScript poszerza literały: port: 8080 staje się typem number, a nie literałem 8080. Zwykle jest to odpowiednie, ale czasami potrzebne jest zachowanie dokładnej wartości.

const settings = { mode: "dark" }
type S = typeof settings // { mode: string }
const x: S = { mode: "anything" }
console.log(x)

typeof z as const

Dodaj as const, aby zamrozić wartość i nadać jej najwęższy typ literałowy. Teraz typeof przechwytuje dokładne literały i oznacza wszystko jako readonly.

const settings = { mode: "dark" } as const
type S = typeof settings // { readonly mode: "dark" }
const x: S = { mode: "dark" }
console.log(x)

Typy literałowe z tablic

W połączeniu z as const zastosowanie typeof do tablicy daje krotkę readonly z typami literałowymi — podstawę do wyprowadzania unii wartości.

const roles = ["admin", "editor", "viewer"] as const
type Roles = typeof roles // readonly ["admin", "editor", "viewer"]
console.log(roles[0])

Wyprowadzanie unii wartości

Połącz typeof z dostępem indeksowanym przez [number], aby przekształcić tablicę stałych w typ unii jej wartości.

const roles = ["admin", "editor", "viewer"] as const
type Role = typeof roles[number] // "admin" | "editor" | "viewer"
const r: Role = "editor"
console.log(r)

typeof dla funkcji

Można również przechwycić typ funkcji. Jest to przydatne podczas typowania funkcji opakowujących lub ponownego wykorzystywania sygnatury w innym miejscu.

function add(a: number, b: number) { return a + b }
type AddFn = typeof add // (a: number, b: number) => number
const myAdd: AddFn = (x, y) => x + y
console.log(myAdd(2, 3))

Utrzymywanie synchronizacji typów

Największa korzyść polega na tym, że konfigurację lub stałe definiuje się raz jako wartości, a następnie wyprowadza typy za pomocą typeof. Po zmianie wartości typ aktualizuje się automatycznie — bez duplikowania definicji.

const defaults = { retries: 3, timeout: 1000 }
type Defaults = typeof defaults
function apply(opts: Defaults) { return opts.retries }
console.log(apply(defaults))

Działa tylko z identyfikatorami

Operator typów typeof przyjmuje identyfikator lub ścieżkę właściwości, a nie dowolne wyrażenie. typeof (a + b) jest niedozwolone.

const obj = { user: { name: "Ada" } }
type Name = typeof obj.user.name // string
const n: Name = "Leo"
console.log(n)

Szybkie sprawdzenie

Sprawdź swoje rozumienie operatora typów typeof.

Podsumowanie

Operator typów typeof (w pozycji typu) wyprowadza typ z wartości — zmiennej, obiektu, tablicy lub funkcji. Domyślnie literały są poszerzane; dodaj as const, aby przechwycić dokładne typy literałowe jako readonly. W połączeniu z dostępem indeksowanym (typeof arr[number]) operator ten tworzy unie wartości. Wyprowadzanie typów z wartości zapewnia jedno źródło prawdy i pozwala uniknąć duplikowania struktur.

Często zadawane pytania

Czy lekcja „Operator typu typeof” jest bezpłatna?

Tak — pełny tekst „Operator typu typeof” 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 „Operator typu typeof”?

Pobieraj typ wartości w czasie wykonywania za pomocą typeof Ć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 4.

Ile czasu zajmuje lekcja „Operator typu typeof”?

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. Operator typu typeof
  2. Operator typu keyof
  3. Typy dostępu indeksowanego
  4. Łączenie typeof i keyof
← Powrót do TypeScript Academy