Lecciones del módulo (2/2)
Arreglos y Tuplas
En JavaScript, los arrays pueden contener cualquier tipo de elemento y pueden crecer o reducirse de manera totalmente dinámica. TypeScript agrega verificación de tipos estática para garantizar que las colecciones permanezcan homogéneas o respeten una estructura de tipos fija.
Arrays (Colecciones Homogéneas)
En TypeScript, existen dos formas equivalentes de definir el tipo de un array que contiene elementos del mismo tipo:
-
Usar el tipo de elemento seguido de corchetes (
[]):TSconst numbers: number[] = [1, 2, 3]; const strings: string[] = ['a', 'b', 'c']; -
Usar el tipo genérico
Array<T>:TSconst numbers: Array<number> = [1, 2, 3];
Ambas sintaxis son perfectamente válidas, pero la primera (tipo[]) es la convencional y más común en casi todos los proyectos. Si intentas insertar un valor no válido (ej. numbers.push("hello") en un array de tipo number[]), TypeScript generará un error en tiempo de compilación.
Las Tuplas (Estructuras de tamaño fijo)
Una tupla es un tipo especial de array que tiene un número fijo de elementos y en el que cada elemento tiene un tipo específico predefinido basado en su posición exacta.
Por ejemplo, si queremos almacenar una respuesta HTTP compuesta por un código de estado (número) y un mensaje (cadena):
const response: [number, string] = [200, 'OK'];En este caso:
- El primer elemento (
response[0]) debe ser unnumber. - El segundo elemento (
response[1]) debe ser unastring. - El array debe inicializarse con exactamente 2 elementos.
Tuplas de Solo Lectura (readonly)
Un detalle importante sobre las tuplas en TypeScript es que en tiempo de ejecución siguen siendo arrays normales de JavaScript. Esto significa que métodos como .push() o .pop() están técnicamente disponibles y podrían alterar la longitud de la tupla, eludiendo parcialmente las comprobaciones de tipo.
Para evitar este comportamiento y garantizar una verdadera inmutabilidad, podemos utilizar el modificador readonly:
const point: readonly [number, number] = [10, 20];
// point.push(30); // Errore a tempo di compilazione!Pruébalo tú
Ejercicio 1: Array de Números
Declara un array llamado scores que contenga solo números y esté inicializado con los valores 90, 85 y 95. Usa la anotación de tipo explícita para el array. No uses el tipo any.
Mostrar pista
Usa la sintaxis const scores: number[] = ... o Array<number>.
Solución disponible después de 3 intentos
Ejercicio 2: Tupla Coordenadas 3D
Declara una tupla llamada point que represente una coordenada 3D (tres números para X, Y, Z) y esté inicializada con los valores 10, 20, 30. Usa la anotación de tipo explícita.
Mostrar pista
El tipo de la tupla debe ser [number, number, number].
Solución disponible después de 3 intentos
Ejercicio 3: Tupla Información de Ubicación
Declara una tupla llamada locationInfo que represente una coordenada geográfica con su nombre. Debe contener: latitud (número), longitud (número) y nombre de la ciudad (cadena). Inicialízala con los valores 41.9028, 12.4964 y 'Rome'.
Mostrar pista
Usa la sintaxis para definir una tupla con tres elementos: [number, number, string].
Solución disponible después de 3 intentos
Ejercicio 4: Tupla Línea de Log
Declara una tupla llamada logEntry que represente una línea de registro (log). Debe contener en orden: una marca de tiempo (número), un nivel de severidad (cadena) y un mensaje de error (cadena). Inicialízala con la marca de tiempo 1716300000, nivel 'INFO' y mensaje 'Application started'.
Mostrar pista
Usa la sintaxis para definir una tupla de tres elementos: [number, string, string] y asigna los valores indicados.
Solución disponible después de 3 intentos