ProgramaciónDesarrollador de TypeScript

Explique el papel y la mecánica del operador typeof en TypeScript para tipar variables. ¿Cómo se utiliza para inferir el tipo de una variable o estructura de objeto, y en qué casos es preferible a la asignación manual de tipos?

Supere entrevistas con el asistente de IA Hintsage

Respuesta.

TypeScript soporta el operador typeof no solo en tiempo de ejecución (como en JavaScript), sino también en tiempo de compilación para inferir el tipo de una expresión. Esto permite obtener el tipo de una variable, función o estructura de objeto ya declarada, lo que hace que la tipificación sea más flexible y reduce la probabilidad de duplicación y desincronización de tipos.

Historia de la cuestión

Originalmente, en JavaScript, el operador typeof se utilizaba para determinar el tipo de un valor en tiempo de ejecución. TypeScript ha ampliado este mecanismo: ahora typeof en el tiempo de compilación crea una referencia al tipo del valor de una variable o al resultado de una función. Esto es extremadamente útil al trabajar con estructuras complejas, configuraciones y al reutilizar tipos entre módulos.

Problema

Al declarar manualmente un tipo, es fácil cometer errores: cambiar la definición de una estructura y olvidar actualizar la declaración de tipo o interfaz, o copiar incorrectamente tipos entre objetos. Esto lleva a la desincronización del código y a errores en tiempo de ejecución. Al usar typeof, el tipo se infiere dinámicamente y siempre corresponde a la estructura actual de los datos.

Solución

Para declarar una variable con un tipo que coincida con una estructura o constante ya existente, se utiliza el operador typeof:

const config = { host: "localhost", port: 8080, }; let serverCfg: typeof config; // El tipo de serverCfg es el mismo que el de config

Para tipar una función que devuelve una estructura determinada:

function makeUser() { return { id: 1, name: "Alex" }; } type User = ReturnType<typeof makeUser>; // User: {id: number; name: string;}

Características clave:

  • typeof en TS devuelve el tipo del valor de la variable o el resultado de la expresión en el tiempo de compilación.
  • Permite evitar duplicaciones y desincronizaciones de tipos.
  • A menudo se combina con tipos utilitarios adicionales (ReturnType, Parameters), así como con keyof para obtener una lista de claves de un objeto.

Preguntas capciosas.

¿Se ejecuta el operador typeof en TypeScript en tiempo de ejecución?

No, el typeof tipado solo funciona durante la compilación, no entra en el código de tiempo de ejecución, aunque el operador typeof de JavaScript existe también en tiempo de ejecución.

¿Puede typeof utilizarse para inferir el tipo de propiedades de una clase?

Sí, pero solo si la propiedad ya está declarada como estática o con un valor inicial, de lo contrario, habrá un error. Para private/public protected, solo se consideran propiedades/métodos públicos.

¿Hay diferencia entre 'let x: typeof y;' y 'let x = y;'?

Desde el punto de vista del tipo, en ambos casos el compilador inferirá el tipo automáticamente. Sin embargo, 'typeof' se puede utilizar para escribir declaraciones de tipos sin inicialización o para combinaciones más complejas con tipos utilitarios.

Errores comunes y antipatrón.

  • Usar typeof para la habitual verificación de tipo de js typeof x === 'string' — esto es de tiempo de ejecución, no un tipo compilable.
  • Reutilizar el valor de una estructura cuando solo se necesita su forma (es mejor separar la estructura en un tipo separado).

Ejemplo de la vida real

Caso negativo.

En el proyecto se describe un gran objeto de configuración de la aplicación por separado como tipo, y por separado como variable. Al cambiar la estructura, olvidan actualizar el tipo, lo que lleva a errores en el funcionamiento de la API.

Pros: Trabajo flexible con tipos, se pueden redefinir tipos a través de type o interface.

Contras: Gran riesgo de desincronización entre la estructura y los tipos, mala mantenibilidad.

Caso positivo.

Uso de typeof para obtener el tipo actual de la estructura del objeto al declarar nuevas variables y al generar tipos para la interfaz API.

Pros: El tipo siempre coincide con el valor, baja probabilidad de error, buena autocompletación.

Contras: Si el objeto es muy complejo, el tipo resultante puede ser confuso de leer para los principiantes.