Genéricos

¡Bienvenido a la próxima lección! En esta lección, aprenderá sobre los genéricos, una potente característica de TypeScript que permite crear componentes reutilizables y con seguridad de tipos. ¡Comencemos!

¿Qué son los genéricos?

Los genéricos permiten escribir código reutilizable que funciona con cualquier tipo. Actúan como marcadores de posición para los tipos que puede especificar al usarlos.

Ejemplo: una función genérica:

Tarea: Escriba una función genérica que reciba un argumento y lo devuelva sin modificarlo.

function identity<T>(value: T): T {
  return value;
}

console.log(identity<string>("Hello")); 
// Output: Hello
console.log(identity<number>(42)); 
// Output: 42

¿Por qué usar genéricos?

Los genéricos le ayudan a:

• Escribir código reutilizable: Las funciones y las clases pueden trabajar con distintos tipos.
• Garantizar la seguridad de tipos: Puede exigir tipos específicos sin sacrificar la flexibilidad.
• Reducir la redundancia: Evite escribir versiones independientes de la misma función o clase para distintos tipos.

Consejo: Use genéricos para escribir código más flexible y fácil de mantener.

Funciones genéricas

Puede usar genéricos para crear funciones flexibles. Ejemplo:

Tarea: Escriba una función genérica que combine dos objetos y devuelva el resultado.

function merge<T, U>(obj1: T, obj2: U): T & U {
  return { ...obj1, ...obj2 };
}

let merged = merge({ name: "Alice" }, { age: 25 });
console.log(merged); 
// Output: { name: "Alice", age: 25 }

Clases genéricas

Los genéricos se pueden usar en clases para hacerlas reutilizables con distintos tipos. Ejemplo:

class Box<T> {
  private contents: T;

  constructor(contents: T) {
    this.contents = contents;
  }

  getContents(): T {
    return this.contents;
  }
}

let stringBox = new Box<string>("Hello");
console.log(stringBox.getContents()); 
// Output: Hello

let numberBox = new Box<number>(42);
console.log(numberBox.getContents()); 
// Output: 42

Interfaces genéricas

Las interfaces también pueden usar genéricos para imponer una estructura con distintos tipos. Ejemplo:

Tarea: Defina una interfaz genérica y cree un objeto que la implemente.

interface Pair<T, U> {
  first: T;
  second: U;
}

let coordinates: Pair<number, number> = { first: 10, second: 20 };
console.log(coordinates); 
// Output: { first: 10, second: 20 }

Restricciones de los genéricos

Puede agregar restricciones a los genéricos para garantizar que funcionen solo con tipos específicos. Ejemplo:

function printLength<T extends { length: number }>(item: T): void {
  console.log(`Length: ${item.length}`);
}

printLength("Hello"); 
// Output: Length: 5
printLength([1, 2, 3]); 
// Output: Length: 3
// printLength(42); 
// Error: Argument of type 'number' is not assignable to parameter of type '{ length: number }'.

Valores predeterminados de los genéricos

Puede especificar tipos predeterminados para los genéricos si no se proporciona ningún tipo. Ejemplo:

Tarea: Cree una función genérica con un tipo predeterminado y pruébela con distintos tipos.

function wrap<T = string>(value: T): T[] {
  return [value];
}

console.log(wrap("Hello")); // Output: ["Hello"]
console.log(wrap(42)); // Output: [42]

¡Excelente trabajo!

¡Felicidades! Ha aprendido a usar genéricos en TypeScript para crear funciones, clases e interfaces reutilizables y con seguridad de tipos. Los genéricos son una herramienta potente para escribir código flexible y escalable. En la próxima lección, exploraremos tipos avanzados, como los tipos mapeados y condicionales. ¡Sigamos programando!