TypeScript Academy · Lektion

Praktiske satisfies-mønstre

Anvend satisfies på config-objekter og opslagstabeller

Lektion 4 af 413 trin

Praktiske satisfies-mønstre 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.

Validering af en farvepalette

Et almindeligt mønster er satisfies Record<string, Color> til en palette: hver værdi kontrolleres som en gyldig farve, mens nøglerne bevarer deres nøjagtige typer til kodefuldførelse.

type Color = "red" | "green" | "blue";
const palette = {
  primary: "blue",
  secondary: "green"
} satisfies Record<string, Color>;
console.log(palette.primary);

Opdagelse af ugyldige paletteværdier

Hvis en værdi ikke er en gyldig Color, rapporterer satisfies en fejl, mens nøglerne fortsat har præcise typer.

type Color = "red" | "green" | "blue";
// const bad = { primary: "purple" } satisfies Record<string, Color>; // Error
const ok = { primary: "red" } satisfies Record<string, Color>;
console.log(ok.primary);

Bevar kodefuldførelse for nøgler

Fordi de infererede nøgler er "primary" | "secondary", foreslår din kodeeditor dem automatisk, i modsætning til en almindelig Record-annotering, som ville miste de specifikke nøgler.

type Color = "red" | "green" | "blue";
const palette = { primary: "red", accent: "blue" } satisfies Record<string, Color>;
// palette.<autocomplete: primary, accent>
console.log(palette.accent);

Validering af et rutekort

Rutekort har også fordel af dette: værdierne skal passe til en håndteringsfunktions struktur, mens rutenavnene forbliver kendte til navigationshjælpere.

type Route = { method: "GET" | "POST"; path: string };
const routes = {
  home: { method: "GET", path: "/" },
  login: { method: "POST", path: "/login" }
} satisfies Record<string, Route>;
console.log(routes.login.method);

Indeksering i kortet

Når nøglerne bevares, kan du opbygge en type med gyldige rutenavne og indeksere typesikkert i korttypen.

type Route = { method: string; path: string };
const routes = {
  home: { method: "GET", path: "/" },
  about: { method: "GET", path: "/about" }
} satisfies Record<string, Route>;
type RouteName = keyof typeof routes; // "home" | "about"
const pick: RouteName = "about";
console.log(routes[pick].path);

Typet konfiguration med blandede værdier

satisfies fungerer også, når værdierne har forskellige strukturer. Begræns dem med en unionstype, så hver værdi valideres mod den.

type Setting = number | boolean | string;
const config = {
  retries: 3,
  verbose: true,
  region: "eu"
} satisfies Record<string, Setting>;
console.log(config.retries, config.verbose);

Enum-lignende opslagstabeller

Opbyg en opslagstabel, der valideres mod en værditype, samtidig med at hver post bevarer sin nøjagtige type til senere brug.

type Status = "active" | "inactive";
const userStatus = {
  alice: "active",
  bob: "inactive"
} satisfies Record<string, Status>;
const s: "active" = userStatus.alice;
console.log(s);

Kombination med as const

Kombinér as const og satisfies for dybt uforanderlige, validerede data: as const fastfryser dem, og satisfies kontrollerer dem.

type Color = "red" | "blue";
const theme = {
  primary: "red",
  secondary: "blue"
} as const satisfies Record<string, Color>;
console.log(theme.primary);

Validering af numeriske områder efter type

Du kan begrænse værdier til en union af numeriske literaler for at modellere faste sæt af valgmuligheder, der valideres på definitionstidspunktet.

type Level = 1 | 2 | 3;
const levels = {
  easy: 1,
  medium: 2,
  hard: 3
} satisfies Record<string, Level>;
console.log(levels.hard);

Et kort over funktionsflag

En praktisk konfiguration af funktionsflag: nøglerne er flagnavne, som du kan få kodefuldførelse for, og værdierne er booleske værdier, der valideres af satisfies.

const flags = {
  newDashboard: true,
  betaSearch: false
} satisfies Record<string, boolean>;
type Flag = keyof typeof flags;
const f: Flag = "betaSearch";
console.log(flags[f]);

Hvorfor dette mønster er bedst

På tværs af paletter, ruter og flag giver satisfies Record<...> validerede værdier samt præcise nøgler og literaler – den praktiske balance til typede konfigurationer.

type Color = "red" | "green" | "blue";
const ui = { brand: "green", warn: "red" } satisfies Record<string, Color>;
console.log(Object.keys(ui).join(","));

Hurtig kontrol: Praktisk brug af satisfies

Kontrollér din forståelse af praktiske satisfies-mønstre.

Besvar den i den interaktive lektion

Opsummering: Praktiske satisfies-mønstre

Du har anvendt satisfies Record<string, Color> på paletter, rutekort, flag og opslagstabeller, så de nøjagtige nøgler og literaler bevares til kodefuldførelse, mens hver værdi valideres.

type Color = "red" | "blue";
const theme = { bg: "blue", fg: "red" } satisfies Record<string, Color>;
console.log(theme.bg, theme.fg);

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

Start gratis Se hele kurset

Ofte stillede spørgsmål

Er lektionen “Praktiske satisfies-mønstre” gratis?

Ja — hele teksten til “Praktiske satisfies-mønstre” 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 “Praktiske satisfies-mønstre”?

Anvend satisfies på config-objekter og opslagstabeller 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 “Praktiske satisfies-mønstre”?

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

← Tilbage til TypeScript Academy