TypeScript Academy · Lektion

null, undefined och strikta nullkontroller

Hantera null och undefined säkert med strikt läge.

Lektion 4 av 413 steg

null, undefined och strikta nullkontroller ä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.

Välkommen

I JavaScript är null och undefined vanliga orsaker till fel vid körning. TypeScripts strikta nullkontroller tvingar er att hantera dem uttryckligen.

null jämfört med undefined

`undefined` betyder att en variabel har deklarerats men inte tilldelats något värde. `null` anger att värdet medvetet saknas. Båda är separata typer i TypeScript.

let a: undefined = undefined;
let b: null = null;

Utan strikta nullkontroller

Utan `strictNullChecks` är null och undefined subtyper till alla typer. Detta är standard i äldre versioner av TypeScript och är i allmänhet osäkert.

// strictNullChecks: false (unsafe default)
let name: string = null; // allowed — dangerous!

Aktivera strikta nullkontroller

Med `strictNullChecks: true` (som ingår i `strict`) kan null och undefined endast tilldelas till sina egna typer eller till uttryckliga unionstyper.

// strictNullChecks: true
let name: string = null; // Error!
let maybeName: string | null = null; // OK

Valfria egenskaper

Objektegenskaper som markeras med `?` är implicit av typen `T | undefined`. Ni måste hantera fallet där de saknas.

interface Config {
  host: string;
  port?: number; // number | undefined
}

const c: Config = { host: 'localhost' };
console.log(c.port?.toString()); // optional chaining

Begränsa nullable typer

Använd en if-kontroll för att begränsa en union med null eller undefined innan ni kommer åt egenskaper.

function greet(name: string | null): string {
  if (name === null) return 'Guest';
  return 'Hello, ' + name;
}

Valfri kedjning (?.)

Operatorn `?.` avbryter uttrycket och ger `undefined` om vänsterledet är null eller undefined, vilket förhindrar en krasch vid körning.

const user = getUser();
const city = user?.address?.city; // undefined if any step is null

Nullish coalescing (??)

Operatorn `??` returnerar högerledet endast när vänsterledet är null eller undefined – till skillnad från `||`, som aktiveras för alla falsy-värden.

const port = config.port ?? 3000; // 3000 if port is null/undefined
const label = name ?? 'Anonymous';

Operatorn för non-null-assertion (!)

Postfixoperatorn `!` talar om för TypeScript att ni är säkra på att ett värde inte är null eller undefined. Använd den endast när ni är helt säkra.

const el = document.getElementById('root')!;
el.textContent = 'Loaded'; // no null check needed

Returnera null jämfört med undefined

Föredra att returnera `null` för att ange ett avsiktligt tomt resultat och `undefined` för värden som saknas eller är valfria. Var konsekventa i kodbasen.

function findUser(id: number): User | null {
  return db.find(u => u.id === id) ?? null;
}

strictNullChecks förhindrar miljarddollarmisstaget

Tony Hoare kallade null för sitt ”miljarddollarmisstag”. TypeScripts strictNullChecks förhindrar krascher på grund av null eller undefined genom att tvinga er att hantera dessa värden uttryckligen.

Snabbkontroll

Vad returnerar operatorn `??` (nullish coalescing) från högerledet?

Besvara frågan i den interaktiva lektionen

Sammanfattning

Aktivera strictNullChecks för att förhindra buggar med null och undefined. Använd unionstyper för att tillåta nullable värden, valfri kedjning (?.) för säker åtkomst i kedjor och nullish coalescing (??) för att ange standardvä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 ”null, undefined och strikta nullkontroller” gratis?

Ja – hela texten till ”null, undefined och strikta nullkontroller” 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 ”null, undefined och strikta nullkontroller”?

Hantera null och undefined säkert med strikt läge. 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 ”null, undefined och strikta nullkontroller”?

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

Primitiva typer: string, number, boolean
Typen any och varför den bör undvikas
unknown kontra any: det säkrare valet
null, undefined och strikta nullkontroller

← Tillbaka till TypeScript Academy