TypeScript Academy · Lección

Funciones genéricas: parámetros de tipo

Añada parámetros de tipo a las funciones para reutilizarlas.

Funciones genéricas: parámetros de tipo es una lección gratuita de TypeScript Academy en CoddyKit. Esta es la lección 1 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.

Bienvenida

Los genéricos permiten escribir funciones que funcionan con cualquier tipo y mantienen la seguridad de tipos. En lugar de usar `any`, se utiliza un parámetro de tipo que se resuelve cuando se llama a la función.

El problema que resuelven los genéricos

Una función que devuelve `any` pierde la información de tipos. Los genéricos conservan la relación entre los tipos de entrada y de salida.

// Without generics — loses type info
function first(arr: any[]): any { return arr[0]; }

// With generics — type-safe
function first<T>(arr: T[]): T { return arr[0]; }

Sintaxis de los parámetros de tipo

Declare un parámetro de tipo con corchetes angulares `` antes de la lista de parámetros. Utilice T en los parámetros y en el tipo de retorno.

function identity<T>(value: T): T {
  return value;
}
const n = identity(42);       // T is number
const s = identity('hello');  // T is string

Inferencia de tipos en funciones genéricas

TypeScript infiere el argumento de tipo a partir del argumento real. Rara vez necesita especificarlo explícitamente.

function wrap<T>(val: T): T[] { return [val]; }
const nums = wrap(42);    // T inferred as number -> number[]
const strs = wrap('hi');  // T inferred as string -> string[]

Varios parámetros de tipo

Las funciones pueden tener varios parámetros de tipo.

function pair<A, B>(a: A, b: B): [A, B] {
  return [a, b];
}
const p = pair(1, 'hello'); // [number, string]

Funciones genéricas para arrays

Los genéricos son esenciales para las funciones de utilidad de arrays que funcionan con cualquier tipo de elemento.

function filterNull<T>(arr: (T | null)[]): T[] {
  return arr.filter((x): x is T => x !== null);
}

Argumentos de tipo explícitos

Puede proporcionar explícitamente los argumentos de tipo cuando TypeScript no pueda inferirlos.

function create<T>(): T | null { return null; }
const user = create<User>(); // T cannot be inferred — must be explicit

Genéricos frente a any

A diferencia de `any`, los genéricos mantienen la relación entre los tipos a lo largo de la función. El tipo de retorno está vinculado al tipo de entrada.

function echo<T>(val: T): T { return val; }
const n: number = echo(42);   // OK
// const s: string = echo(42); // Error — T is number

Funciones flecha genéricas

Las funciones flecha utilizan la misma sintaxis, pero necesitan una coma en los archivos .tsx para distinguirlas de las etiquetas JSX.

const identity = <T>(val: T): T => val;
// In .tsx files:
const identity2 = <T,>(val: T): T => val;

Devolver un tipo diferente

Las funciones genéricas pueden utilizar el parámetro de tipo de formas transformadas.

function mapArray<T, U>(arr: T[], fn: (item: T) => U): U[] {
  return arr.map(fn);
}
const lengths = mapArray(['hello', 'world'], s => s.length);
// lengths: number[]

Parámetros genéricos con valores predeterminados

Proporcione un tipo predeterminado para un parámetro de tipo con el fin de hacerlo opcional.

function createList<T = string>(): T[] { return []; }
const list = createList(); // T defaults to string

Comprobación rápida

¿Cuál es el tipo de retorno de `identity(42)`?

Resumen

Las funciones genéricas utilizan parámetros de tipo (T) para conservar las relaciones entre las entradas y las salidas. TypeScript infiere los argumentos de tipo automáticamente. Utilice genéricos en lugar de any para escribir utilidades reutilizables y con seguridad de tipos.

Preguntas frecuentes

¿La lección «Funciones genéricas: parámetros de tipo» es gratis?

Sí — el texto completo de «Funciones genéricas: parámetros de tipo» 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 «Funciones genéricas: parámetros de tipo»?

Añada parámetros de tipo a las funciones para reutilizarlas. 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 1 de 4.

¿Cuánto tiempo toma la lección «Funciones genéricas: parámetros de tipo»?

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

← Volver a TypeScript Academy