TypeScript Academy · Lektion

Typesikker håndtering af unknown

Indsnævr unknown-værdier, før De bruger dem sikkert

Lektion 4 af 413 trin

Typesikker håndtering af unknown er en gratis TypeScript Academy-lektion på CoddyKit. Dette er lektion 4 af 4. Du kan læse hele lektionen gratis nedenfor — og derefter øve dig praktisk i browseren med en indbygget kodeeditor og en AI-vejleder, der er tilgængelig døgnet rundt. Den er en del af læringsforløbet i TypeScript Academy, og dine fremskridt synkroniseres på tværs af nettet og CoddyKit-appen. TypeScript Academy-kurset indeholder 4 lektioner i alt.

Arbejd sikkert med unknown

At type eksterne data som unknown er kun den ene halvdel af opgaven. Den anden halvdel er at indsnævre dem til en konkret type, før de bruges. Denne lektion gennemgår de vigtigste teknikker til typeindsnævring.

function describe(v: unknown): string {
  if (typeof v === 'string') return 'string: ' + v;
  if (typeof v === 'number') return 'number: ' + v;
  return 'other';
}
console.log(describe('hi'), describe(7), describe(true));

Typeindsnævring med typeof

typeof-kontrollen er det enkleste værktøj. Den indsnævrer unknown til primitive typer: string, number, boolean, function, object og flere.

function double(v: unknown): number {
  if (typeof v === 'number') {
    return v * 2; // v is number here
  }
  return 0;
}
console.log(double(21), double('no'));

Typeindsnævring med instanceof

Brug instanceof til instanser af klasser. Den indsnævrer unknown til den specifikke klasse, så du kan bruge dens metoder og egenskaber sikkert.

function handle(v: unknown): string {
  if (v instanceof Date) {
    return v.toISOString(); // v is Date
  }
  return 'not a date';
}
console.log(handle(new Date(0)));

Typeindsnævring med in-operatoren

in-operatoren kontrollerer, om en egenskab findes på et objekt, og indsnævrer værdier af objekttype. Bekræft først, at værdien er et objekt, der ikke er null, og undersøg derefter dets nøgler.

function getName(v: unknown): string {
  if (typeof v === 'object' && v !== null && 'name' in v) {
    return String((v as { name: unknown }).name);
  }
  return 'anonymous';
}
console.log(getName({ name: 'Ada' }), getName(5));

Brugerdefinerede type guards

En brugerdefineret type guard er en funktion, hvis returtype er value is T. Når den returnerer true, indsnævrer TypeScript argumentet til T på det sted, hvor funktionen kaldes.

function isString(v: unknown): v is string {
  return typeof v === 'string';
}

function shout(v: unknown): string {
  return isString(v) ? v.toUpperCase() : '?';
}
console.log(shout('hey'), shout(9));

Type guards til objektstrukturer

Brugerdefinerede type guards er særligt nyttige til validering af objektstrukturer. Skriv én funktion, der kontrollerer alle påkrævede felter, så kan resten af koden stole på den indsnævrede type.

type User = { id: number; name: string };

function isUser(v: unknown): v is User {
  return typeof v === 'object' && v !== null &&
    'id' in v && 'name' in v;
}
console.log(isUser({ id: 1, name: 'Sam' }), isUser({}));

JSON.parse returnerer data, der ligner unknown

JSON.parse er typet til at returnere any, hvilket ubemærket omgår sikkerheden. God praksis er at gemme resultatet som unknown og validere det, før du stoler på strukturen.

function parseConfig(text: string): unknown {
  return JSON.parse(text);
}
const raw = parseConfig('{"port":8080}');
console.log(typeof raw);

Validering af fortolket JSON

Kombiner JSON.parse med en type guard for sikkert at omdanne tekst, du ikke stoler på, til en typet værdi. Hvis valideringen mislykkes, skal du håndtere fejlen i stedet for at stole på ugyldige data.

type Config = { port: number };

function isConfig(v: unknown): v is Config {
  return typeof v === 'object' && v !== null &&
    'port' in v && typeof (v as any).port === 'number';
}

const data: unknown = JSON.parse('{"port":8080}');
if (isConfig(data)) console.log('Port:', data.port);

Kædning af flere type guards

Ved komplekse input kan du lagdele type guards: Kontrollér først den overordnede struktur, og foretag derefter en mere præcis indsnævring. Hver type guard indsnævrer lidt mere, så du trin for trin får præcise og sikre typer.

function process(v: unknown): string {
  if (Array.isArray(v)) {
    if (v.every((x) => typeof x === 'string')) {
      return v.join('-');
    }
  }
  return 'invalid';
}
console.log(process(['a', 'b']), process([1, 2]));

Kast ved ugyldige data

Når valideringen mislykkes for påkrævede data, skal du kaste en fejl. Kombineret med en hjælpefunktion, der returnerer never, holder det den normale sti ren og korrekt typet.

function asNumber(v: unknown): number {
  if (typeof v === 'number') return v;
  throw new Error('Expected a number');
}
console.log(asNumber(42));
try { asNumber('x'); } catch (e) { console.log('rejected'); }

Saml det hele

Det fulde mønster er: Modtag data som unknown, indsnævr dem med type guards, og arbejd derefter med den præcise type. Det er den sikre grænse mellem den typeløse omverden og din typede kode.

type Point = { x: number; y: number };
function isPoint(v: unknown): v is Point {
  return typeof v === 'object' && v !== null &&
    'x' in v && 'y' in v;
}
const input: unknown = { x: 1, y: 2 };
if (isPoint(input)) console.log(input.x + input.y);

Hurtig kontrol

Test din forståelse af sikker håndtering af unknown.

Opsummering: Håndtering af unknown

Du har lært at indsnævre unknown med:

  • typeof til primitive typer og instanceof til instanser af klasser.
  • in-operatoren til egenskaber på objekter.
  • Brugerdefinerede type guards, der returnerer value is T.
  • Validering af resultater fra JSON.parse, før du stoler på dem.

Næste kursus: typeassertioner og typekonvertering.

function isNonEmpty(v: unknown): v is string {
  return typeof v === 'string' && v.length > 0;
}
console.log(isNonEmpty('hi'), isNonEmpty(''));
Gratis at komme i gang

Lær TypeScript med en AI-underviser — gratis

Skriv og kør rigtig kode i din browser, få øjeblikkelig hjælp fra en AI-underviser døgnet rundt, og fortsæt, hvor du slap, på web eller i appen.

Kurser
101
Lektioner
352

Ofte stillede spørgsmål

Er lektionen “Typesikker håndtering af unknown” gratis?

Ja — hele teksten til “Typesikker håndtering af unknown” kan læses gratis her på nettet. Hvis du vil øve dig interaktivt med en indbygget kodeeditor og en AI-vejleder døgnet rundt og få adgang til resten af TypeScript Academy-kurset, skal du opgradere til CoddyKit PRO. TypeScript Academy-kurset indeholder 4 lektioner i alt.

Hvad lærer jeg i “Typesikker håndtering af unknown”?

Indsnævr unknown-værdier, før De bruger dem sikkert Du øver dig i TypeScript Academy med praktisk kode, som du kører direkte i browseren, og en AI-vejleder døgnet rundt besvarer dine spørgsmål, mens du arbejder dig gennem lektionen.

Skal jeg have erfaring for at begynde på TypeScript Academy?

Der kræves ingen tidligere erfaring. TypeScript Academy på CoddyKit er tilrettelagt for både begyndere og øvede, så du kan starte her eller fra begyndelsen og lære i dit eget tempo. Dette er lektion 4 af 4.

Hvor lang tid tager lektionen “Typesikker håndtering af unknown”?

De fleste CoddyKit-lektioner tager cirka 5–10 minutter. Hver lektion er kort og interaktiv, så du gør løbende fremskridt og kan fortsætte, hvor du slap – på både web og app.

Kan jeg skrive og køre kode i denne TypeScript Academy-lektion?

Ja. Alle TypeScript Academy-lektioner har en indbygget kodeeditor, så du kan skrive og køre rigtig kode direkte i din browser og få øjeblikkelig feedback fra AI – uden lokal opsætning.

Alle lektioner i dette kursus

  1. Forstå unknown kontra any
  2. Typen never og umulige tilstande
  3. Typen void i funktioner
  4. Typesikker håndtering af unknown
← Tilbage til TypeScript Academy