¡Más allá de los básicos! Explorando enum, tuple, array, union, intersection, type aliases y type assertions en TypeScript

Pablo Contreras
3 min readJun 2, 2023

--

¡Hola, apasionados del código! ¿Listos para seguir desvelando los secretos de TypeScript? Hoy, vamos a zambullirnos en el emocionante mundo de los tipos avanzados: enum, tuple, array, union, intersection, type aliases y type assertions. ¿Listos para zarpar? ¡Vamos allá!

En nuestro último encuentro, hablamos de los tipos básicos de TypeScript. Ahora, es momento de dar un paso adelante y descubrir los tipos más sofisticados que hacen que TypeScript sea realmente excepcional. ¡Prepárense para un viaje lleno de “¡Aha!” momentos!

Profundicemos:

1. enum: Nos permite definir un conjunto de constantes con nombre.

enum Color {Red, Green, Blue}
let c: Color = Color.Green;
// ¡Bravo! 'c' es del tipo Color y ha sido asignado al valor Color.Green.

enum Color {Red, Green, Blue}
let c: Color = "Green";
// ¡Oops! TypeScript esperaba un valor de tipo Color, pero recibió una cadena.

2. tuple: Nos permite expresar un array con un número fijo de elementos cuyos tipos son conocidos.

let x: [string, number] = ["hello", 10]; 
// ¡Perfecto! 'x' es una tupla con un string y un número.

let x: [string, number] = [10, "hello"]; 
// ¡Ay caramba! TypeScript esperaba un string seguido de un número, pero recibió un número seguido de un string.

3. array: Nos permite declarar una serie de elementos del mismo tipo.

let arr: number[] = [1, 2, 3];
// ¡Fabuloso! 'arr' es un array de números.

let arr: number[] = [1, "2", 3];
// ¡Uh-oh! TypeScript esperaba un array de números, pero uno de los elementos es una cadena.

4. union: Nos permite combinar diferentes tipos en uno solo.✅

let mixedType: number | string = "hello";
// ¡Sensacional! 'mixedType' puede ser un número o un string.

let mixedType: number | string = true;
// ¡D'oh! TypeScript esperaba un número o un string, pero recibió un booleano.

5. intersection: Nos permite combinar múltiples tipos en uno.

type First = { a: number };
type Second = { b: string };
type FirstAndSecond = First & Second;
let ab: FirstAndSecond = { a: 1, b: "hello" };
// ¡Fantástico! 'ab' es de tipo FirstAndSecond, que es la intersección de First y Second.

let ab: FirstAndSecond = { a: 1, b: true };
// ¡Ayayay! TypeScript esperaba que 'b' fuera un string, pero es un booleano.

6. type aliases: Nos permiten crear un nuevo nombre para un tipo.

type StringOrNumber = string | number;
let sample: StringOrNumber = "hello";
// ¡Excelente! 'sample' puede ser un string o un número.

let sample: StringOrNumber = true;
// ¡Oops! TypeScript esperaba un string o un número, pero recibió un booleano.

7. type assertions: Nos permiten especificar el tipo de valor que esperamos.

let someValue: any = "this is a string";
let strLength: number = (<string>someValue).length;
// ¡Bien hecho! Afirmamos que 'someValue' es un string, por lo que podemos acceder a su propiedad 'length'.

let someValue: any = 5;
let strLength: number = (<string>someValue).length;
// ¡Auch! Afirmamos que 'someValue' es un string, pero en realidad es un número, así que no tiene propiedad 'length'.

¡Y eso es todo por hoy, amigos del código! Esperamos que esta exploración por los tipos avanzados de TypeScript te haya proporcionado un mayor entendimiento de las maravillas de este lenguaje.

Gracias por seguirnos en este emocionante viaje por TypeScript. Recuerda, cada línea de código es un paso hacia convertirte en el mago del universo de la programación. ¡Hasta la próxima!

--

--

Pablo Contreras

Desarrollador con conocimientos en JS, TS y Python. Construí soluciones para restaurantes y fintech. Aprendiendo y compartiendo en mi newsletter.