TypeScript Academy · Lección

reflect-metadata y tipos de diseño

Capture tipos de parámetros y propiedades en tiempo de ejecución.

Lección 3 de 413 pasos

reflect-metadata y tipos de diseño es una lección gratuita de TypeScript Academy en CoddyKit. Esta es la lección 3 de 4. Puedes leer la lección completa abajo gratuitamente — luego la practicas en el navegador con un editor de código integrado y un tutor de IA 24/7. Forma parte de la ruta de aprendizaje de TypeScript Academy, y tu progreso se sincroniza en la web y la app de CoddyKit. El curso de TypeScript Academy incluye 4 lecciones en total.

reflect-metadata y los tipos de diseño

Antes de que existieran los metadatos estandarizados, TypeScript podía emitir información de tipos en tiempo de diseño durante la ejecución mediante la biblioteca reflect-metadata y la opción del compilador emitDecoratorMetadata. Esta lección explica ese mecanismo antiguo, aunque todavía ampliamente utilizado.

Activación de la función

Se requieren dos cosas: activar las opciones del compilador e importar la biblioteca una vez en el punto de entrada del programa.

// tsconfig.json
// {
//   "compilerOptions": {
//     "experimentalDecorators": true,
//     "emitDecoratorMetadata": true
//   }
// }

import "reflect-metadata";

Qué se emite

Con emitDecoratorMetadata, el compilador emite tres claves para los miembros decorados: design:type, design:paramtypes y design:returntype. Los valores son las funciones constructoras (por ejemplo, String, Number).

Lectura de design:type

Para una propiedad decorada, Reflect.getMetadata("design:type", target, key) devuelve el constructor del tipo de la propiedad.

import "reflect-metadata";

function track(target: any, key: string) {
  const t = Reflect.getMetadata("design:type", target, key);
  console.log(key, "->", t.name); // e.g. "name -> String"
}

class Person {
  @track name!: string;
  @track age!: number;
}

Lectura de design:paramtypes

En un constructor o método, design:paramtypes es un array de constructores de los tipos de los parámetros, la base de la inyección de dependencias.

function injectable(target: any) {
  const params = Reflect.getMetadata("design:paramtypes", target);
  console.log(params.map((p: any) => p.name)); // ["Database", "Logger"]
}

@injectable
class Service {
  constructor(private db: Database, private log: Logger) {}
}

Limitaciones de los tipos emitidos

Solo persisten los tipos simples que pueden representarse en tiempo de ejecución. Las interfaces, uniones y genéricos se reducen a Object porque no tienen un constructor en tiempo de ejecución. Los tipos de diseño son aproximados; no representan el tipo completo de TS.

Metadatos personalizados con Reflect

También puede definir sus propias claves de metadatos con Reflect.defineMetadata, independientemente de los tipos de diseño.

import "reflect-metadata";

function required(target: any, key: string) {
  Reflect.defineMetadata("required", true, target, key);
}

function isRequired(target: any, key: string) {
  return Reflect.getMetadata("required", target, key) === true;
}

Dónde se utiliza

Este mecanismo impulsa muchos frameworks consolidados (NestJS, TypeORM, class-validator). Estos leen design:type y design:paramtypes para conectar dependencias y validar valores sin que tenga que volver a declarar los tipos.

reflect-metadata frente a los metadatos estándar

La nueva API Symbol.metadata forma parte del lenguaje y no emite tipos de diseño. reflect-metadata proporciona de forma exclusiva información de tipos, pero está vinculada al modo experimental de decoradores. Elija un modelo por proyecto.

El orden de importación es importante

import "reflect-metadata" debe ejecutarse una vez, antes de que se evalúe cualquier clase decorada, porque modifica el objeto global Reflect con las funciones de metadatos. Impórtelo en la primera línea del archivo de entrada.

Por qué es importante

La emisión de tipos de diseño permite a los frameworks conectar los tipos en tiempo de compilación con el comportamiento en tiempo de ejecución, lo que hace posible una inyección de dependencias y una validación más sencillas. Conocer sus límites (sin interfaces ni genéricos) evita resultados inesperados de Object.

Comprobación rápida

Compruebe su comprensión de reflect-metadata.

Resumen

Con experimentalDecorators + emitDecoratorMetadata y un import "reflect-metadata" temprano, el compilador emite design:type y design:paramtypes como constructores en tiempo de ejecución. Los frameworks los leen para DI y validación, aunque las interfaces, uniones y genéricos se degradan a Object.

Gratis para empezar

Aprende TypeScript con un tutor de IA — gratis

Escribe y ejecuta código real en tu navegador, obtén ayuda instantánea de un tutor de IA disponible 24/7 y continúa donde lo dejaste en la web o en la aplicación.

Cursos
101
Lecciones
352

Preguntas frecuentes

¿La lección «reflect-metadata y tipos de diseño» es gratis?

Sí — el texto completo de «reflect-metadata y tipos de diseño» es gratis para leer aquí en la web. Para practicarla de forma interactiva (editor de código integrado y tutor de IA 24/7) y desbloquear el resto del curso de TypeScript Academy, actualiza a CoddyKit PRO. El curso de TypeScript Academy incluye 4 lecciones en total.

¿Qué aprenderé en «reflect-metadata y tipos de diseño»?

Capture tipos de parámetros y propiedades en tiempo de ejecución. Practicas TypeScript Academy con código real que ejecutas directamente en el navegador, y un tutor de IA 24/7 responde tus preguntas mientras trabajas en la lección.

¿Necesito experiencia previa para empezar TypeScript Academy?

No se requiere experiencia previa. TypeScript Academy en CoddyKit está estructurado para principiantes hasta estudiantes avanzados, así que puedes empezar aquí o desde el inicio y avanzar a tu ritmo. Esta es la lección 3 de 4.

¿Cuánto tiempo toma la lección «reflect-metadata y tipos de diseño»?

La mayoría de las lecciones de CoddyKit toman alrededor de 5–10 minutos. Cada una es compacta e interactiva, así que avanzas constantemente y retomas exactamente por donde dejaste en la web y la app.

¿Puedo escribir y ejecutar código en esta lección de TypeScript Academy?

Sí. Cada lección de TypeScript Academy incluye un editor de código integrado, así que escribes y ejecutas código real directamente en tu navegador y obtienes retroalimentación instantánea de IA — sin configuración local necesaria.

Todas las lecciones de este curso

  1. Explicación de los decoradores de Stage 3
  2. Metadatos de decoradores
  3. reflect-metadata y tipos de diseño
  4. Construcción de un framework de decoradores
← Volver a TypeScript Academy