Tipos de unión e intersección de TypeScript

TypeScript ofrece potentes funciones de sistema de tipos que le ayudan a escribir código más seguro y predecible. Entre estas funciones se encuentran los tipos de unión e intersección, que ofrecen flexibilidad para definir y gestionar tipos complejos. Este artículo presenta estos conceptos y proporciona ejemplos para ilustrar su uso.

¿Qué son los tipos de sindicato?

Los tipos de unión permiten que una variable contenga valores de distintos tipos. Esto resulta útil cuando se necesita representar un valor que podría ser de varios tipos. Los tipos de unión se indican mediante el símbolo | (barra vertical).

Definición de tipos de unión

Para definir un tipo de unión, se especifican varios tipos separados por el símbolo |:

let value: string | number;

value = "Hello, TypeScript"; // Valid
value = 42; // Valid
value = true; // Error: Type 'boolean' is not assignable to type 'string | number'

En este ejemplo, la variable valor puede ser una cadena o un número, pero no un booleano.

Uso de tipos de unión en funciones

Los tipos de unión son particularmente útiles en funciones donde los parámetros o tipos de retorno pueden ser de múltiples tipos:

function formatValue(value: string | number): string {
  if (typeof value === "string") {
    return value.toUpperCase();
  } else {
    return value.toFixed(2);
  }
}

console.log(formatValue("hello")); // Output: HELLO
console.log(formatValue(123.456)); // Output: 123.46

La función formatValue toma un parámetro que puede ser una string o un number y lo formatea en consecuencia.

¿Qué son los tipos de intersección?

Los tipos de intersección permiten combinar varios tipos en uno solo. Esto significa que un valor del tipo de intersección satisfará todos los tipos de la intersección. Los tipos de intersección se indican mediante el símbolo & (& comercial).

Definición de tipos de intersecciones

Para definir un tipo de intersección, especifique varios tipos separados por el símbolo &:

interface Person {
  name: string;
}

interface Employee {
  employeeId: number;
}

type EmployeePerson = Person & Employee;

const john: EmployeePerson = {
  name: "John Doe",
  employeeId: 1234
};

console.log(john.name); // Output: John Doe
console.log(john.employeeId); // Output: 1234

En este ejemplo, el tipo EmployeePerson combina las interfaces Person y Employee, lo que da como resultado un tipo que tiene propiedades name y employeeId.

Uso de tipos de intersección en funciones

Los tipos de intersección también se pueden utilizar en funciones para requerir múltiples propiedades de tipo:

function printEmployeeDetails(employee: Person & Employee): void {
  console.log(`Name: ${employee.name}`);
  console.log(`Employee ID: ${employee.employeeId}`);
}

const jane: EmployeePerson = {
  name: "Jane Smith",
  employeeId: 5678
};

printEmployeeDetails(jane);
// Output:
// Name: Jane Smith
// Employee ID: 5678

La función printEmployeeDetails requiere un argumento que satisfaga los tipos Person y Employee.

Combinación de tipos de unión e intersección

Puede combinar tipos de unión e intersección para crear definiciones de tipos complejas:

type Shape = Circle | Rectangle;

interface Circle {
  kind: "circle";
  radius: number;
}

interface Rectangle {
  kind: "rectangle";
  width: number;
  height: number;
}

function getArea(shape: Shape): number {
  if (shape.kind === "circle") {
    return Math.PI * shape.radius * shape.radius;
  } else {
    return shape.width * shape.height;
  }
}

const myCircle: Circle = { kind: "circle", radius: 10 };
const myRectangle: Rectangle = { kind: "rectangle", width: 20, height: 30 };

console.log(getArea(myCircle)); // Output: 314.159...
console.log(getArea(myRectangle)); // Output: 600

En este ejemplo, el tipo Shape es una unión de Circle y Rectangle, y la función getArea maneja ambos tipos en consecuencia.

Conclusión

Los tipos de unión e intersección en TypeScript proporcionan formas eficaces de gestionar y combinar tipos, ofreciendo flexibilidad y precisión en las definiciones de tipos. Los tipos de unión permiten que una variable sea uno de varios tipos, mientras que los tipos de intersección combinan varios tipos en uno. Al utilizar estas funciones, puede crear aplicaciones más robustas y seguras en cuanto a tipos.

Practique el uso de tipos de unión e intersección para familiarizarse con sus capacidades y mejorar sus habilidades de codificación de TypeScript.