El Proyecto | Sobre nosotros | Contribuir | Donaciones | Licencia

HOME

En este módulo, exploraremos los tipos avanzados en TypeScript, que te permitirán escribir código más robusto y flexible. Estos tipos son esenciales para manejar estructuras de datos complejas y para aprovechar al máximo las capacidades de TypeScript.

Tipos de Unión y de Intersección

Tipos de Unión

Los tipos de unión permiten que una variable pueda ser de uno de varios tipos. Esto es útil cuando una variable puede tener múltiples formas.

Sintaxis:

let variable: string | number;
variable = "Hola";
variable = 42;

Explicación:

variable puede ser un string o un number.
Esto es útil para funciones que pueden aceptar múltiples tipos de argumentos.

Tipos de Intersección

Los tipos de intersección combinan múltiples tipos en uno solo. Una variable de tipo intersección debe cumplir con todos los tipos combinados.

Sintaxis:

interface A {
  propA: string;
}

interface B {
  propB: number;
}

type AB = A & B;

const obj: AB = {
  propA: "Hello",
  propB: 123
};

Explicación:

AB es un tipo que combina las propiedades de A y B.
obj debe tener tanto propA como propB.

Tipos Condicionales

Los tipos condicionales permiten definir tipos basados en una condición.

Sintaxis:

type IsString<T> = T extends string ? "Yes" : "No";

type Test1 = IsString<string>; // "Yes"
type Test2 = IsString<number>; // "No"

Explicación:

IsString es un tipo condicional que verifica si T es un string.
Devuelve "Yes" si T es un string, de lo contrario, "No".

Tipos Mapeados

Los tipos mapeados permiten crear nuevos tipos transformando las propiedades de un tipo existente.

Sintaxis:

type Readonly<T> = {
  readonly [K in keyof T]: T[K];
};

interface User {
  name: string;
  age: number;
}

type ReadonlyUser = Readonly<User>;

const user: ReadonlyUser = {
  name: "Alice",
  age: 30
};

// user.name = "Bob"; // Error: Cannot assign to 'name' because it is a read-only property.

Explicación:

Readonly convierte todas las propiedades de T en propiedades de solo lectura.
ReadonlyUser es una versión de User donde las propiedades no se pueden modificar.

Tipos Indexados

Los tipos indexados permiten acceder a los tipos de las propiedades de un objeto.

Sintaxis:

interface Person {
  name: string;
  age: number;
}

type NameType = Person["name"]; // string

Explicación:

NameType es el tipo de la propiedad name de Person, que es string.

Ejercicios Prácticos

Ejercicio 1: Uso de Tipos de Unión

Crea una función que acepte un argumento que pueda ser un string o un number y devuelva su longitud.

function getLength(input: string | number): number {
  if (typeof input === "string") {
    return input.length;
  } else {
    return input.toString().length;
  }
}

Ejercicio 2: Tipos de Intersección

Define dos interfaces Car y Boat, y crea un tipo AmphibiousVehicle que combine ambas.

interface Car {
  wheels: number;
  drive(): void;
}

interface Boat {
  sails: number;
  sail(): void;
}

type AmphibiousVehicle = Car & Boat;

const vehicle: AmphibiousVehicle = {
  wheels: 4,
  sails: 2,
  drive() {
    console.log("Driving");
  },
  sail() {
    console.log("Sailing");
  }
};

Ejercicio 3: Tipos Condicionales

Crea un tipo condicional que verifique si un tipo es boolean y devuelva "Boolean" o "Not Boolean".

type IsBoolean<T> = T extends boolean ? "Boolean" : "Not Boolean";

type TestBoolean1 = IsBoolean<boolean>; // "Boolean"
type TestBoolean2 = IsBoolean<string>; // "Not Boolean"

Conclusión

En este módulo, hemos explorado los tipos avanzados de TypeScript, que son herramientas poderosas para crear aplicaciones más seguras y flexibles. Estos conceptos te permitirán manejar estructuras de datos complejas y escribir código más expresivo. En el siguiente módulo, aplicaremos estos conocimientos en el contexto de Playwright para mejorar nuestras pruebas automatizadas.

Tipos Avanzados de TypeScript

Tipos de Unión y de Intersección

Tipos de Unión

Tipos de Intersección

Tipos Condicionales

Tipos Mapeados

Tipos Indexados

Ejercicios Prácticos

Ejercicio 1: Uso de Tipos de Unión

Ejercicio 2: Tipos de Intersección

Ejercicio 3: Tipos Condicionales

Conclusión

Playwright con TypeScript: De Principiante a Avanzado

Módulo 1: Introducción a Playwright y TypeScript

Módulo 2: Comenzando con Playwright

Módulo 3: Fundamentos de Playwright y TypeScript

Módulo 4: Funciones Avanzadas de Playwright

Módulo 5: Estrategias de Automatización de Pruebas

Módulo 6: Técnicas Avanzadas de TypeScript

Módulo 7: Aplicaciones Reales de Playwright

Módulo 8: Conclusión del Curso y Próximos Pasos