Nyttetyper i TypeScript

Denne artikkelen forklarer nyttetyper i TypeScript.

YouTube Video

Nyttetyper i TypeScript

Nyttetyper i TypeScript er praktiske verktøy for å lage nye typer basert på eksisterende typer. Dette muliggjør mer fleksible typedefinisjoner og øker gjenbrukbarheten av kode. Her vil vi forklare vanlige nyttetyper i detalj og diskutere hvordan man bruker hver enkelt med eksempler.

Partial<T>

Partial<T> gjør alle egenskaper i en objekttype valgfrie (tillater undefined). Det er nyttig når du kun vil bruke noen av egenskapene som den opprinnelige typen har.

 1interface User {
 2  id: number;
 3  name: string;
 4  age: number;
 5}
 6
 7function updateUser(user: Partial<User>) {
 8  console.log(user);
 9}
10
11updateUser({ name: "Alice" }); // Updates only 'name'

• I eksempelet ovenfor gjør bruk av Partial<User> alle egenskapene til User-typen valgfrie. Derfor kan du i updateUser-funksjonen sende inn kun et delsett av egenskapene.

Required<T>

Required<T> gjør alle egenskaper, inkludert valgfrie, påkrevde. Den brukes når du vil gjøre valgfrie egenskaper påkrevde.

 1interface User {
 2  id: number;
 3  name?: string;
 4  age?: number;
 5}
 6
 7function createUser(user: Required<User>) {
 8  console.log(user);
 9}
10
11// createUser({ id: 1 }); // Error: 'name' and 'age' are required
12createUser({ id: 1, name: "Alice", age: 25 });

• Ved å bruke Required<User> behandles egenskaper som name og age som påkrevde.

Readonly<T>

Readonly<T> gjør alle egenskaper til et objekt skrivebeskyttede. Dette forhindrer at verdiene til objektet kan endres.

 1interface User {
 2  id: number;
 3  name: string;
 4}
 5
 6const user: Readonly<User> = {
 7  id: 1,
 8  name: "Alice"
 9};
10
11// user.id = 2; // Error: 'id' is read-only
12console.log(user);

• Ved å bruke Readonly<T> kan du beskytte et objekts egenskaper fra å bli endret. Det er effektivt når du vil forhindre at data utilsiktet endres under utvikling.

Record<K, T>

Record<K, T> lager en karttype med spesifiserte nøkkel- og verdi-typer. K er typen for nøklene (for eksempel string eller number), og T er typen for verdiene.

 1type Roles = "admin" | "user" | "guest";
 2interface ReadWritePermissions {
 3  read: boolean;
 4  write: boolean;
 5}
 6
 7const rolePermissions: Record<Roles, ReadWritePermissions> = {
 8  admin: { read: true, write: true },
 9  user: { read: true, write: false },
10  guest: { read: false, write: false },
11};
12
13console.log(rolePermissions);

• Record<K, T> er nyttig når du vil definere nøkkel-verdi-par. I eksempelet ovenfor er tillatelser definert basert på brukerroller.

Pick<T, K>

Pick<T, K> henter ut kun spesifiserte egenskaper fra en objekttype. Du kan lage en ny type ved å hente ut kun de nødvendige egenskapene.

 1interface User {
 2  id: number;
 3  name: string;
 4  age: number;
 5}
 6
 7type UserSummary = Pick<User, "id" | "name">;
 8
 9const summary: UserSummary = {
10  id: 1,
11  name: "Alice"
12};
13
14console.log(summary);

• Ved å bruke Pick<T, K> kan du hente ut spesifikke egenskaper fra en objekttype og behandle dem som en ny type. For eksempel, kun id og name hentes ut i eksempelet ovenfor.

Omit<T, K>

Omit<T, K> ekskluderer bestemte egenskaper fra en objekttype. Dette er den motsatte operasjonen av Pick.

 1interface User {
 2  id: number;
 3  name: string;
 4  age: number;
 5  email: string;
 6}
 7
 8type UserWithoutEmail = Omit<User, "email">;
 9
10const userWithoutEmail: UserWithoutEmail = {
11  id: 1,
12  name: "Alice",
13  age: 25
14};
15
16console.log(userWithoutEmail);

• Ved å bruke Omit<T, K> kan du lage en ny type ved å ekskludere bestemte egenskaper. I eksempelet ovenfor er email-egenskapen ekskludert.

Exclude<T, U>

Exclude<T, U> lager en ny type ved å fjerne typen U fra unionstypen T. Den brukes når du vil fjerne en spesifikk type.

1type Status = "active" | "inactive" | "pending";
2type ExcludedStatus = Exclude<Status, "pending">;
3
4const userStatus: ExcludedStatus = "active"; // "pending" is excluded, so it cannot be chosen
5console.log(userStatus);

• Ved å bruke Exclude<T, U> kan du fjerne unødvendige typer i en unionstype. I eksempelet ovenfor, siden "pending" er ekskludert, kan kun "active" eller "inactive" velges.

Extract<T, U>

Extract<T, U> trekker ut delene som samsvarer med typen U i unionstypen T. Den er nyttig når du vil trekke ut kun en spesifikk type.

1type Status = "active" | "inactive" | "pending";
2type ActiveStatus = Extract<Status, "active" | "pending">;
3
4const userStatus: ActiveStatus = "active"; // "inactive" cannot be chosen
5console.log(userStatus);

• Extract<T, U> utfører den motsatte operasjonen av Exclude. I eksempelet ovenfor kan kun "active" og "pending" velges.

NonNullable<T>

NonNullable<T> lager en type der null og undefined er ekskludert. Den er nyttig når du vil ekskludere disse verdiene fra valgfrie typer.

1type UserName = string | null | undefined;
2type ValidUserName = NonNullable<UserName>;
3
4const userName: ValidUserName = "Alice"; // null and undefined cannot be chosen
5console.log(userName);

• NonNullable<T> ekskluderer null og undefined, og sikrer at en verdi er til stede.

Konklusjon

TypeScript-nyttetyper er kraftige verktøy for å gjøre typedefinisjoner mer konsise og fleksible. Å forstå og bruke grunnleggende nyttetyper som Partial, Required, Readonly, Record osv. på riktig måte kan forbedre gjenbrukbarheten og vedlikeholdbarheten av koden. Å mestre disse typene gir mulighet for mer robuste og sikre typedefinisjoner, noe som legger til rette for effektiv utvikling.

TypeScripts keyof-operator

TypeScripts keyof-operator brukes til å hente alle egenskapsnavnene til en objekttype. Ved å bruke denne operatoren kan du hente nøklene til en objekttype som en unionstype. Dette er ekstremt nyttig for å skrive typesikker kode.

Grunnleggende bruk

1interface Person {
2    name: string;
3    age: number;
4    email: string;
5}
6
7// Use keyof to get the property names of Person
8type PersonKeys = keyof Person; // "name" | "age" | "email"

Eksempel på bruk

Bruke den i funksjonsargumenter

Du kan bruke keyof til å definere en funksjon som har typer basert på spesifikke egenskaper til et objekt.

 1function getProperty<T, K extends keyof T>(obj: T, key: K): T[K] {
 2    return obj[key];
 3}
 4
 5const person: Person = { name: "Alice", age: 30, email: "alice@example.com" };
 6const userName = getProperty(person, "name"); // type is string
 7const age = getProperty(person, "age");   // type is number
 8
 9console.log("Name:", userName);
10console.log("Age:", age);

• Denne funksjonen henter en egenskap fra et objekt på en typesikker måte basert på den spesifiserte nøkkelen.

Forbedre typerestriksjoner

Ved å bruke keyof kan du sørge for at nøklene som sendes til en funksjon, blir validert under kompilering.

1// Passing an invalid property name results in an error
2const invalid = getProperty(person, "invalidKey"); // Error

• Denne koden viser at hvis man spesifiserer et ikke-eksisterende egenskapsnavn, vil det føre til en kompileringstid-feil.

Sammendrag

• keyof-operatoren brukes til å hente alle egenskapsnavnene til en objekttype.
• Du kan hente egenskapsnavnene som en unionstype og oppnå typesikker kode.
• Ved å bruke den i funksjonsargumenter kan du begrense funksjonen til kun å akseptere gyldige egenskapsnavn.

På denne måten forbedrer keyof-operatoren typesikkerheten i TypeScript og hjelper deg med å skrive mer robust kode.

Du kan følge med på artikkelen ovenfor ved å bruke Visual Studio Code på vår YouTube-kanal. Vennligst sjekk ut YouTube-kanalen.

YouTube Video