TypeScript Academy · Lektion

Generiska funktioner: typparametrar

Lägg till typparametrar i funktioner för återanvändbarhet

Lektion 1 av 413 steg

Generiska funktioner: typparametrar är en gratis lektion i TypeScript Academy på CoddyKit. Detta är lektion 1 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

Generics låter dig skriva funktioner som fungerar med alla typer och samtidigt bevarar typsäkerheten. I stället för `any` använder du en typparameter som bestäms när funktionen anropas.

Problemet som generics löser

En funktion som returnerar `any` förlorar typinformation. Generics bevarar relationen mellan indata- och utdatatypen.

// Without generics — loses type info
function first(arr: any[]): any { return arr[0]; }

// With generics — type-safe
function first<T>(arr: T[]): T { return arr[0]; }

Syntax för typparametrar

Deklarera en typparameter med vinkelparenteser `` före parameterlistan. Använd T i parametrarna och returtypen.

function identity<T>(value: T): T {
  return value;
}
const n = identity(42);       // T is number
const s = identity('hello');  // T is string

Typinferens för generiska funktioner

TypeScript härleder typargumentet från det faktiska argumentet. Du behöver sällan ange det uttryckligen.

function wrap<T>(val: T): T[] { return [val]; }
const nums = wrap(42);    // T inferred as number -> number[]
const strs = wrap('hi');  // T inferred as string -> string[]

Flera typparametrar

Funktioner kan ha flera typparametrar.

function pair<A, B>(a: A, b: B): [A, B] {
  return [a, b];
}
const p = pair(1, 'hello'); // [number, string]

Generiska arrayfunktioner

Generics är avgörande för arrayverktygsfunktioner som fungerar med valfri elementtyp.

function filterNull<T>(arr: (T | null)[]): T[] {
  return arr.filter((x): x is T => x !== null);
}

Explicit angivna typargument

Du kan ange typargument uttryckligen när TypeScript inte kan härleda dem.

function create<T>(): T | null { return null; }
const user = create<User>(); // T cannot be inferred — must be explicit

Generics jämfört med any

Till skillnad från `any` bevarar generics relationen mellan typerna genom hela funktionen. Returtypen är kopplad till indatatypen.

function echo<T>(val: T): T { return val; }
const n: number = echo(42);   // OK
// const s: string = echo(42); // Error — T is number

Generiska pilfunktioner

Pilfunktioner använder samma syntax, men i .tsx-filer behöver du ett kommatecken för att skilja syntaxen från JSX-taggar.

const identity = <T>(val: T): T => val;
// In .tsx files:
const identity2 = <T,>(val: T): T => val;

Returnera en annan typ

Generiska funktioner kan använda typparametern på transformerade sätt.

function mapArray<T, U>(arr: T[], fn: (item: T) => U): U[] {
  return arr.map(fn);
}
const lengths = mapArray(['hello', 'world'], s => s.length);
// lengths: number[]

Generiska parametrar med standardvärden

Ange en standardtyp för en typparameter så att den blir valfri.

function createList<T = string>(): T[] { return []; }
const list = createList(); // T defaults to string

Snabbkontroll

Vilken returtyp har `identity(42)`?

Besvara frågan i den interaktiva lektionen

Sammanfattning

Generiska funktioner använder typparametrar (T) för att bevara relationer mellan indata och utdata. TypeScript härleder typargument automatiskt. Använd generics i stället för any när du skriver återanvändbara och typsäkra verktygsfunktioner.

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 ”Generiska funktioner: typparametrar” gratis?

Ja – hela texten till ”Generiska funktioner: typparametrar” 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 ”Generiska funktioner: typparametrar”?

Lägg till typparametrar i funktioner för återanvändbarhet 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 1 av 4.

Hur lång tid tar lektionen ”Generiska funktioner: typparametrar”?

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

← Tillbaka till TypeScript Academy