VITON13School

TypeScriptLección 11 de 16

readonly y tipos utilitarios

Los tipos utilitarios crean un tipo nuevo a partir de otro, así que nunca lo describes dos veces. Son genéricos que vienen incluidos en TypeScript.

Lo esencial

  • Readonly<T> y un campo readonly impiden sobrescribir.
  • Partial<T> vuelve opcionales todos los campos, ideal para actualizaciones.
  • Pick<T, "a" | "b"> conserva solo los campos indicados; Omit<T, "id"> los quita.
  • Record<K, V> es un objeto con claves K y valores V.
  • readonly string[] es un array sin push ni otros métodos que lo modifiquen.

Ejemplo

interface Profile {  readonly id: number;  name: string;  email: string;} type ProfileUpdate = Partial<Profile>; // every field becomes optionaltype PublicProfile = Pick<Profile, "id" | "name">; // only these two fieldstype NewProfile = Omit<Profile, "id">; // everything except idtype Scores = Record<string, number>; // keys are strings, values are numbers const patch: ProfileUpdate = { name: "Sam" };const card: PublicProfile = { id: 7, name: "Sam" };const draft: NewProfile = { name: "Kim", email: "kim@example.com" };const scores: Scores = { math: 5, art: 4 };// card.id = 8; // error: 'id' is read-only const week: readonly string[] = ["Mon", "Tue"];// week.push("Wed"); // error: push does not exist on readonly string[] console.log(`${patch.name} #${card.id}, ${draft.name}, math ${scores.math}, ${week.length} days`);

De un solo Profile salen cuatro tipos y ningún campo se escribe dos veces. Si Profile cambia, los tipos derivados se actualizan solos.

Tarea

Cómo usar el editor⌘ Enter o Ctrl Enter ejecuta el código, ⇧ ⌘ Enter comprueba la tarea.Tab y Mayús Tab sangran la línea o la selección; Esc y luego Tab sale del editor.La comprobación compara lo que imprimió el programa con la tarea; los espacios al final de línea no cuentan.Tras dos comprobaciones fallidas puedes ver la solución. Tu código se guarda en este navegador.

Haz defaults de solo lectura, patch un Partial y summary un Pick de dos campos, añade titles con Record e imprime «Default: light, 16px», «Mine: dark, 18px», «Night mode».

Salida

Aquí aparecerá lo que imprima el programa.