Respuesta.

Los operadores keyof y typeof son herramientas potentes de tipado en TypeScript. Su uso conjunto permite construir tipos sobre la marcha, crear funciones seguras y expresar la estructura de los objetos de manera flexible.

Contexto

typeof en TypeScript se utiliza para inferir el tipo a partir de una variable, mientras que keyof devuelve una unión de todas las claves de un objeto o tipo. Juntos, permiten trabajar con objetos declarados dinámicamente y crear tipos interrelacionados.

Problema

Sin estos operadores, al trabajar con objetos, enums y tablas de correspondencia, a menudo es necesario repetir manualmente las cadenas de claves en tipos y valores, lo que lleva a errores de desincronización y complica el mantenimiento del código.

Solución

Con typeof se obtiene el tipo del valor de una variable, y con keyof se construye un tipo de unión de todas sus claves. El resultado es la automatización del tipado.

Ejemplo de código:

const ERRORS = {
  NOT_FOUND: 'No encontrado',
  UNAUTHORIZED: 'No autorizado',
  SERVER_ERROR: 'Error del servidor',
};

// A través de typeof obtenemos el tipo, y a través de keyof — todas las claves del objeto

function getErrorMessage(code: keyof typeof ERRORS): string {
  return ERRORS[code];
}

Características clave:

Ayuda a construir tipos estrictamente relacionados de clave-valor sin necesidad de actualización manual.
Permite tipar funciones que trabajan con claves de objetos.
Elimina problemas de desincronización entre claves y tipos.

Preguntas capciosas.

¿Los valores de un objeto obtenidos a través de typeof pueden convertirse automáticamente en claves en un tipo unión?

No, typeof devuelve el tipo de la estructura del objeto, no los valores. Para obtener un union de valores, es necesario obtener los tipos de los valores por separado.

¿Qué devuelve typeof para enum y qué devuelve keyof typeof para enum?

Para enum, typeof devuelve el tipo del objeto enum (con ambas direcciones: clave-valor y valor-clave), mientras que keyof typeof da una unión de las claves de cadena/número de ese objeto. Por ejemplo:

enum Colors { Red = 'R', Blue = 'B' }
type ColorKeys = keyof typeof Colors; // 'Red' | 'Blue'

¿Se puede utilizar keyof typeof para obtener una lista type-safe de todos los posibles parámetros de una función que acepta claves de un objeto?

Sí, de esta manera creas una función que solo acepta claves válidas. Esto previene errores al trabajar con claves de objetos.

const config = { mode: 'dark', lang: 'ru' };
type ConfigKeys = keyof typeof config; // 'mode' | 'lang'
function useConfig(key: ConfigKeys) {
  // ...
}

Errores comunes y anti-patrones

Esperar erróneamente que keyof typeof se puede aplicar a los valores de un array: para un array se trata de índices, no de valores.
No entender que typeof opera a nivel de tipos y no devuelve un valor en tiempo de ejecución.
Aplicarlo a un tipo no declarado explícitamente, lo que interrumpe la inferencia de tipos.

Ejemplo de la vida real

Caso negativo

En una constante con estados de API, se escriben manualmente los tipos de las claves de cadena:

type StatusCodes = 'OK' | 'FAIL' | 'PENDING';
function isKnownStatus(code: StatusCodes) { /* ... */ }

Pros:

Se hace evidente qué cadenas son válidas.

Contras:

Es necesario cambiar manualmente los tipos al actualizar la lista; desincronización y errores.

Caso positivo

Uso de keyof typeof para mantener automáticamente la lista:

const STATUS = { OK: 1, FAIL: 0, PENDING: 2 };
type StatusKeys = keyof typeof STATUS;
function checkStatus(key: StatusKeys) { /* ... */ }