TypeScript Academy · Lektion

Dekoratormetadata

Bifoga och läs metadata med metadata-API:t.

Lektion 2 av 413 steg

Dekoratormetadata är en gratis lektion i TypeScript Academy på CoddyKit. Detta är lektion 2 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.

API:t för dekoratormetadata

Standardiserade dekoratorer innehåller en inbyggd kanal för metadata. Kontextobjektet exponerar ett metadata-objekt som du kan skriva till, och klassen bär senare med sig detta under den välkända nyckeln Symbol.metadata.

context.metadata

Varje dekoratorkontext delar ett enda metadata-objekt för klassen som håller på att definieras. Dekoratorer kopplar data till det; det blir klassens metadata.

function tag(label: string) {
  return function (value: any, context: DecoratorContext) {
    context.metadata[context.name] = label;
  };
}

Läsa via Symbol.metadata

Efter att klassen har definierats finns den insamlade metadatan tillgänglig på SomeClass[Symbol.metadata].

class User {
  @tag("identifier") id = 0;
  @tag("display")    name = "";
}

const meta = (User as any)[Symbol.metadata];
console.log(meta); // { id: "identifier", name: "display" }

Varför ett delat objekt

Eftersom alla dekoratorer på en klass skriver till samma metadata-objekt kan ni samla information från många dekoratorer i en sammanhängande post som beskriver klassen.

Lagra strukturerad metadata

Metadata kan ha vilken struktur som helst. Ett vanligt mönster är att lagra en nästlad post med nyckel efter medlemsnamn.

function column(type: string) {
  return function (value: any, context: ClassFieldDecoratorContext) {
    const md = context.metadata as any;
    md.columns ??= {};
    md.columns[context.name] = { type };
  };
}

Metadata på klassnivå

En klassdekorator kan också skriva metadata, till exempel ett tabellnamn som kompletterar kolumninformationen för de enskilda fälten.

function entity(table: string) {
  return function (value: Function, context: ClassDecoratorContext) {
    (context.metadata as any).table = table;
  };
}

@entity("users")
class UserEntity {
  @column("serial") id = 0;
  @column("text")   name = "";
}

Metadataarv

Metadataobjekt länkas längs prototypkedjan: ett metadataobjekt för en underklass har den överordnade klassens metadata som prototyp, så ärvda poster är synliga om de inte åsidosätts.

Polyfill för Symbol.metadata

Symbol.metadata är en välkänd symbol. I miljöer som saknar den tilldelar ni en polyfill så att runtime-miljön kan koppla det insamlade objektet.

(Symbol as any).metadata ??= Symbol.for("Symbol.metadata");

Metadata utan reflect-metadata

Det här API:et är en del av själva dekoratorförslaget och kräver därför inte det separata biblioteket reflect-metadata. Biblioteket är fortfarande relevant endast för den äldre experimentella genereringen av designtypinformation (nästa lektion).

En praktisk läshjälpfunktion

En liten åtkomstfunktion centraliserar läsningen av metadata från valfri klass och returnerar ett tomt objekt när det inte finns någon metadata.

function getMeta(cls: any): Record<string, any> {
  return (cls[Symbol.metadata] as Record<string, any>) ?? {};
}

Varför det är viktigt

Metadata förvandlar dekoratorer från engångsbaserade beteendeomslag till en deklarativ beskrivning av era klasser. Ramverk läser den här beskrivningen för att bygga ORM:er, validerare och routrar utan hack baserade på reflektion vid körning.

Snabbkontroll

Bekräfta er förståelse av metadata-API:et.

Besvara frågan i den interaktiva lektionen

Sammanfattning

Dekoratorns metadata-API ger varje dekorator ett delat context.metadata-objekt som exponeras på klassen via Symbol.metadata. Dekoratorer samlar strukturerad, ärvbar metadata utan något externt bibliotek, vilket möjliggör deklarativa och ramverksvänliga klassbeskrivningar.

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 ”Dekoratormetadata” gratis?

Ja – hela texten till ”Dekoratormetadata” 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 ”Dekoratormetadata”?

Bifoga och läs metadata med metadata-API:t. 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 2 av 4.

Hur lång tid tar lektionen ”Dekoratormetadata”?

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