TypeScript Academy · Lektion

Tupler: typade arrayer med fast längd

Definiera tupler för strukturerade data med kända positioner.

Lektion 3 av 413 steg

Tupler: typade arrayer med fast längd är en gratis lektion i TypeScript Academy på CoddyKit. Detta är lektion 3 av 4. Ni kan läsa hela lektionen gratis nedan och sedan öva praktiskt i webbläsaren med en inbyggd kodredigerare och en AI-handledare som är tillgänglig dygnet runt. Den ingår i lärvägen för TypeScript Academy, och Era framsteg synkroniseras mellan webben och CoddyKit-appen. Kursen i TypeScript Academy innehåller totalt 4 lektioner.

Välkommen

Tupler är arrayer med ett fast antal element där varje position har en specifik typ. De passar perfekt för strukturerade data som koordinater eller nyckel-värdepar.

Definiera en tupel

En tupeltyp anger typen för varje element i ordning. Längden är fast och varje position måste innehålla den deklarerade typen.

const point: [number, number] = [10, 20];
const entry: [string, number] = ['age', 25];

Komma åt tuplelement

Kom åt tuplelement med hjälp av index. TypeScript känner till typen på varje position.

const pair: [string, number] = ['Alice', 30];
const name: string = pair[0]; // string
const age: number = pair[1];  // number

Destrukturering av tupler

När en tupel destruktureras får varje variabel en specifik härledd typ baserat på sin position.

const [x, y]: [number, number] = [5, 10];
console.log(x + y); // 15

Tupler jämfört med arrayer

En array har ett varierande antal element av samma typ. En tupel har ett fast antal element, som kan ha olika typer, på specifika positioner.

const arr: number[] = [1, 2, 3, 4];   // variable length
const tup: [number, string] = [1, 'a']; // fixed: 2 elements

Valfria tuplelement

Markera ett tuplelement som valfritt med `?`. Valfria element måste komma efter obligatoriska element.

type Named = [string, string?]; // name, optional nickname
const a: Named = ['Alice'];
const b: Named = ['Bob', 'Bobby'];

Rest-element i tupler

Tupler kan ha ett rest-element som fångar ett varierande antal avslutande element av en specifik typ.

type StringAndNumbers = [string, ...number[]];
const data: StringAndNumbers = ['scores', 90, 85, 78];

Etiketterade tuplelement

TypeScript 4.0 lade till etiketterade tuplelement. Etiketterna förbättrar läsbarheten utan att påverka typsystemet.

type Range = [start: number, end: number];
const r: Range = [0, 100];

Readonly-tupler

Lägg till `readonly` för att förhindra att en tupel ändras efter att den har skapats.

const origin: readonly [number, number] = [0, 0];
// origin[0] = 5; // Error

Tupler som returvärden från funktioner

Att returnera en tupel från en funktion är ett mönster som används i React hooks och hjälpfunktioner för att returnera flera värden med olika typer.

function useCounter(): [number, () => void] {
  let count = 0;
  return [count, () => { count++; }];
}

Inferera tupler med as const

Utan `as const` kan en tuppel-literal breddas till en arraytyp. Använd `as const` för att inferera den exakta tuppeltypen.

const pair = [1, 'hello'] as const;
// type: readonly [1, 'hello'] — not (number | string)[]

Snabbkontroll

Vad infererar TypeScript för `const t = [1, 'hello']` utan någon typannotation?

Besvara frågan i den interaktiva lektionen

Sammanfattning

Tupler definierar arrayer med fast längd och typade positioner. Använd dem för koordinater, nyckel-värde-par och funktioner som returnerar flera värden. Lägg till readonly för att förhindra ändringar och as const för att inferera tuppeltyper med literalvärden.

Gratis att börja

Lär dig TypeScript med en AI-lärare – gratis

Skriv och kör riktig kod i webbläsaren, få omedelbar hjälp av en AI-lärare dygnet runt och fortsätt där du slutade – på webben eller i appen.

Kurser: 101
Lektioner: 352

Börja lära dig gratis Visa hela kursen

Vanliga frågor

Är lektionen ”Tupler: typade arrayer med fast längd” gratis?

Ja – hela texten till ”Tupler: typade arrayer med fast längd” kan läsas gratis här på webben. Om Ni vill öva interaktivt med en inbyggd kodredigerare och en AI-handledare som är tillgänglig dygnet runt och låsa upp resten av kursen i TypeScript Academy, kan Ni uppgradera till CoddyKit PRO. Kursen i TypeScript Academy innehåller totalt 4 lektioner.

Vad lär jag mig i ”Tupler: typade arrayer med fast längd”?

Definiera tupler för strukturerade data med kända positioner. Ni övar på TypeScript Academy med praktisk kod som körs direkt i webbläsaren, medan en AI-handledare som är tillgänglig dygnet runt svarar på Era frågor under lektionen.

Behöver jag någon erfarenhet för att börja lära mig TypeScript Academy?

Du behöver inga förkunskaper. Utbildningen i TypeScript Academy på CoddyKit är upplagd för allt från nybörjare till avancerade elever, så att du kan börja här eller från början och gå fram i din egen takt. Detta är lektion 3 av 4.

Hur lång tid tar lektionen ”Tupler: typade arrayer med fast längd”?

De flesta CoddyKit-lektioner tar cirka 5–10 minuter. Varje lektion är kort och interaktiv, så att du gör stadiga framsteg och kan fortsätta precis där du slutade – på webben eller i appen.

Kan jag skriva och köra kod i den här TypeScript Academy-lektionen?

Ja. Varje TypeScript Academy-lektion innehåller en inbyggd kodredigerare, så att du kan skriva och köra riktig kod direkt i webbläsaren och få omedelbar AI-feedback – utan lokal installation.

Alla lektioner i den här kursen

Typade arrayer: T[] och Array
Readonly-arrayer och oföränderlig data
Tupler: typade arrayer med fast längd
Enum: numeriska konstanter och strängkonstanter

← Tillbaka till TypeScript Academy