TypeScript Academy · Lektion

Typsäker hantering av unknown

Begränsa unknown-värden innan ni använder dem på ett säkert sätt.

Lektion 4 av 413 steg

Typsäker hantering av unknown är en gratis lektion i TypeScript Academy på CoddyKit. Detta är lektion 4 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.

Arbeta säkert med unknown

Att typa externa data som unknown är bara halva arbetet. Den andra halvan är att använda narrowing för att förfina den till en konkret typ innan den används. Den här lektionen går igenom de viktigaste teknikerna för narrowing.

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));

Narrowing med typeof

typeof-kontrollen är det enklaste verktyget. Den begränsar unknown till primitiva typer: string, number, boolean, function, object och fler.

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

Narrowing med instanceof

För klassinstanser använder du instanceof. Den förfinar unknown till den specifika klassen, så att dess metoder och egenskaper kan användas på ett säkert sätt.

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)));

Narrowing med operatorn in

Operatorn in kontrollerar om en egenskap finns på ett objekt och förfinar objekt-typade värden. Bekräfta först att värdet är ett objekt som inte är null och undersök sedan dess nycklar.

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));

Egna type guards

En egen type guard är en funktion vars returtyp är value is T. När den returnerar true förfinar TypeScript argumentet till T på anropsstället.

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 för objektstrukturer

Egna type guards är särskilt användbara för att validera objektstrukturer. Skriv en funktion som kontrollerar alla obligatoriska fält, så kan resten av koden lita på den förfinade typen.

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 returnerar data som liknar unknown

JSON.parse är typad att returnera any, vilket tyst kringgår säkerheten. Bästa praxis är att ta emot resultatet som unknown och validera det innan du litar på strukturen.

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

Validera tolkad JSON

Kombinera JSON.parse med en type guard för att på ett säkert sätt omvandla opålitlig text till ett typat värde. Om valideringen misslyckas ska du hantera felet i stället för att lita på felaktiga 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);

Kedja flera guards

För komplexa indata kan du lägga flera guards i lager: kontrollera den övergripande strukturen först och förfina sedan. Varje guard gör typen lite snävare och ger stegvis mer precisa och säkra 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]));

Kasta undantag vid ogiltiga data

När valideringen misslyckas för data som krävs ska du kasta ett undantag. Tillsammans med en hjälpfunktion som returnerar never håller detta den normala vägen ren och korrekt typad.

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'); }

Sätt ihop allt

Det fullständiga mönstret är: ta emot data som unknown, använd guards för narrowing och arbeta sedan med den precisa typen. Detta är den säkra gränsen mellan den otypade omvärlden och din typade kod.

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);

Snabb kontroll

Testa dina kunskaper om säker hantering av unknown.

Besvara frågan i den interaktiva lektionen

Sammanfattning: hantering av unknown

Du har lärt dig att utföra narrowing av unknown med:

typeof för primitiver och instanceof för klassinstanser.
Operatorn in för objektegenskaper.
Egna type guards som returnerar value is T.
Validering av resultat från JSON.parse innan du litar på dem.

Nästa kurs: type assertions och casting.

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

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 ”Typsäker hantering av unknown” gratis?

Ja – hela texten till ”Typsäker hantering av unknown” 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 ”Typsäker hantering av unknown”?

Begränsa unknown-värden innan ni använder dem på ett säkert sätt. 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 4 av 4.

Hur lång tid tar lektionen ”Typsäker hantering av unknown”?

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