Tipos de literales de plantilla en TypeScript

Tipos cadena construidos a partir de otros tipos cadena, en tiempo de compilación.

type Lang = "go" | "ts";
type Tour = "basics" | "async";

type Route = `/${Lang}/${Tour}`;
type EventName = `on${Capitalize<Tour>}`;
type CssVar = `--${string}`;

type ParseRoute<T extends string> =
  T extends `/${infer L}/${infer S}` ? { lang: L; tour: S } : never;

type Parsed = ParseRoute<"/go/basics">;

const route: Route = "/ts/async";
const handler: EventName = "onBasics";
const variable: CssVar = "--accent";
const parsed: Parsed = { lang: "go", tour: "basics" };
console.log(route, handler, variable, parsed.lang);

Cómo funciona

1. Interpolar una unión produce todas las combinaciones.
2. Uppercase, Capitalize y compañía las transforman.
3. infer dentro de un patrón descompone un tipo cadena.

Palabras clave y builtins usados aquí

• CssVar
• EventName
• L
• Parsed
• Route
• S
• const
• extends
• string
• type

El intento, en números

Líneas

17

Caracteres a escribir

524

Tokens

145

Ritmo de tres estrellas

110 tpm

Al ritmo de tres estrellas de 110 tokens por minuto, este intento toma unos 79 segundos.

Escribe este fragmento

Paso 1 de 2 en Cadenas y recursión; paso 7 de 12 en Programación a nivel de tipos.

← Anterior Siguiente →