TypeScript Academy · Lekcja

Elementy rest w krotkach

Używaj elementów rest wewnątrz typów krotek

Elementy rest w krotkach to bezpłatna lekcja TypeScript Academy na CoddyKit. To lekcja 3 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.

Krotki o zmiennej długości

Krotki zwykle mają stałą długość, ale element restowy pozwala jednej pozycji przyjąć dowolną liczbę elementów. Umożliwia to modelowanie danych, które są częściowo stałe, a częściowo zmienne.

Końcowy element restowy

Zapis [string, ...number[]] oznacza: jeden napis, a następnie zero lub więcej liczb. Pierwsza pozycja jest stała, a pozostała część może dowolnie się powiększać.

type Row = [string, ...number[]]
const r: Row = ["scores", 9, 8, 7]
console.log(r[0], r.length) // scores 4

Część stała jest wymagana

Początkowe elementy stałe muszą być obecne. Część restowa może być pusta, ale stałych pozycji nie można pominąć.

type Row = [string, ...number[]]
const min: Row = ["label"] // ok, zero numbers
// const bad: Row = [] // Error: missing string
console.log(min)

Początkowy element restowy

Element restowy może również znajdować się na początku, a za nim mogą występować elementy stałe. Umożliwia to modelowanie zmiennego początku zakończonego stałym końcem.

type Trailing = [...number[], boolean]
const t: Trailing = [1, 2, 3, true]
console.log(t[t.length - 1]) // true

Element restowy w środku

Część restowa może znajdować się w środku, między stałymi elementami początkowymi i końcowymi. TypeScript ustala, które pozycje na obu końcach są stałe.

type Middle = [string, ...number[], boolean]
const m: Middle = ["start", 1, 2, false]
console.log(m[0], m[m.length - 1]) // start false

Tylko jeden element restowy w krotce

Krotka może zawierać najwyżej jeden element restowy. Dwa elementy restowe powodowałyby niejednoznaczność pozycji elementów, dlatego nie są dozwolone.

// type Bad = [...string[], ...number[]] // Error: only one rest allowed
type Ok = [string, ...number[]]
const o: Ok = ["x", 1]
console.log(o)

Destrukturyzacja krotki z elementem restowym

Destrukturyzacja doskonale współgra z elementami restowymi krotek. Stałe wiązania zajmują stałe pozycje, a wiązanie restowe przechwytuje zmienną część jako tablicę z określonym typem.

type Row = [string, ...number[]]
const row: Row = ["scores", 9, 8]
const [label, ...values] = row
console.log(label, values) // scores [9, 8]

Nazwane elementy krotki

Pozycjom krotki można nadać nazwy na potrzeby dokumentacji. Nazwy są widoczne w podpowiedziach i sygnaturach, ale nie zmieniają wartości w czasie działania programu.

type Range = [start: number, end: number]
const span: Range = [0, 10]
console.log(span[0], span[1]) // 0 10

Nazwy elementów restowych

Elementom restowym również można nadać nazwy, co jest szczególnie pomocne w krotkach parametrów funkcji, ponieważ podpowiedzi są wtedy czytelniejsze.

type Args = [command: string, ...flags: string[]]
const a: Args = ["build", "--watch", "--minify"]
console.log(a[0], a.slice(1))

Krotki restowe jako listy parametrów

Krotka z elementem restowym może opisywać listę parametrów funkcji, umożliwiając tworzenie precyzyjnych sygnatur z najpierw stałymi, a następnie zmienną liczbą parametrów za pomocą spread.

type Params = [name: string, ...scores: number[]]
function report(...args: Params): string {
  const [name, ...scores] = args
  return name + ": " + scores.join(",")
}
console.log(report("Ada", 9, 8))

Dlaczego krotki restowe są ważne

Krotki restowe wyrażają struktury, których nie potrafią opisać zwykłe tablice: wymagany nagłówek ze zmienną treścią, zmienną treść z wymaganym zakończeniem albo oba te elementy naraz. Stanowią podstawę typowania funkcji o zmiennej liczbie argumentów.

type CSVRow = [id: number, ...fields: string[]]
const row: CSVRow = [1, "Ada", "Engineer"]
console.log(row[0], row.slice(1))

Szybkie sprawdzenie

Sprawdź swoje rozumienie elementów restowych krotek.

Podsumowanie

Element restowy krotki (...T[]) pozwala jednej pozycji przyjąć dowolną liczbę elementów, podczas gdy stałe elementy początkowe i końcowe pozostają wymagane. Element restowy może znajdować się na końcu, początku lub w środku, ale każda krotka może zawierać tylko jeden taki element. Destrukturyzacja jest zgodna z tymi strukturami, nazwy dodają czytelne podpowiedzi, a krotki restowe stanowią podstawę typowania funkcji o zmiennej liczbie argumentów.

Często zadawane pytania

Czy lekcja „Elementy rest w krotkach” jest bezpłatna?

Tak — pełny tekst „Elementy rest w krotkach” 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 „Elementy rest w krotkach”?

Używaj elementów rest wewnątrz typów krotek Ć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 3 z 4.

Ile czasu zajmuje lekcja „Elementy rest w krotkach”?

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

← Powrót do TypeScript Academy