Una vez que ya conocemos los tipos de datos elementales de Javascript, tenemos que comenzar a pensar más a lo grande. Estos tipos de datos son la naturaleza más pequeña que almacenamos en nuestro código. A medida que nuestra aplicación web va creciendo y haciéndose más grande, comenzaremos a crear estructuras cada vez más complejas.
Estas estructuras se denominan estructuras de datos y conociendo las más básicas suele ser suficiente. Sin embargo, cuantas más conozcamos y dominemos, mucho mejor.
Estas estructuras de datos pueden ser de diversos tipos:
- 1️⃣🟩 Estructuras elementales (primitivos): Tipos de datos (post anterior)
- 2️⃣🟩 Estructuras básicas: Arrays y Objetos
- 3️⃣🟨 Estructuras básicas específicas: Set y Map
- 4️⃣🟥 Estructuras avanzadas: pilas, colas, grafos, árboles, etc. (ver más adelante)
Si estás en una fase inicial aprendiendo Javascript, es suficiente con centrarte en las dos estructuras básicas principales:
y que he marcado en verde. Si ya tienes cierta experiencia, o eres un programador avanzado, echa un vistazo a las siguientes.
Estructuras básicas
Como hemos mencionado, las estructuras elementales son simplemente tipos de datos individuales y muy básicos: Números, valores booleanos, cadenas de texto, números grandes y símbolos. Si no conoces estos tipos de datos, echa un vistazo al post anterior.
Pero dentro de las estructuras que solemos utilizar frecuentemente (que no entran dentro de los tipos primitivos), hay varias estructuras un poco más complejas:
🟩 Arrays
Los arrays son colecciones de elementos, colocados de forma secuencial, uno tras otro. Se utilizan para organizar grupos de datos, que tienen cierta relación entre sí, o que tienen cierto sentido que se coloquen juntos en una sola estructura y en un cierto orden.
Pueden ser de varios tipos:
- 1️⃣ Arrays homogéneos: Colección de elementos del mismo tipo (todos números, por ejemplo).
- 2️⃣ Arrays mixto: Colección de elementos de diferente tipo (diferentes).
- 3️⃣ Arrays de arrays: Colección de elementos, donde sus elementos pueden ser también otros
y que contienen a su vez más información.
Más adelante, hablaremos de las estructuras de tipo Array, sus métodos y temas relacionados.
🟩 Objetos
Los objetos en Javascript también son colecciones como los
Sus características son las siguientes:
- Al contrario que los
, son estructuras que no están ordenadas. Simplemente se almacenan. - Al no estar ordenadas, no puedes recorrerlas (en principio, ya veremos matices más adelante).
- Puedes acceder a sus claves, y así obtener el valor relacionado a esa clave.
- Sólo pueden contener
y como claves. No vale cualquier tipo.
Más adelante hablaremos de las estructuras de tipo Objeto, sus métodos y temas relacionados.
🟧 Set
Los Set o conjuntos, son colecciones de elementos similares a los Array, pero con una diferencia particular: no pueden contener elementos duplicados. Por ejemplo, si tenemos un set de números, el 5 solo puede insertarse una sola vez.
Esto lo hace una estructura de datos ideal si tienes esa restricción en tu caso de uso. Con un array, tendrías que estar controlándolo manualmente.
- Colección de elementos, muy similar a los
- Importante: Los elementos no se pueden repetir si son iguales.
Más adelante, examinaremos los detalles de las estructuras de datos de tipo Set o conjuntos.
🟧 Map
Los Map o mapas, son estructuras muy similares a los objetos de Javascript, sin embargo, son un poco más potentes y eficientes. Es una estructura que permite almacenar pares clave-valor (como los objetos), pero con ciertas diferencias:
- Permite claves de cualquier tipo, no sólo
y como los objetos. - Garantiza un orden de elementos insertados, al contrario que los objetos.
- Es una estructura de datos más eficiente para búsquedas de datos.
Más adelante, profundizaremos en las estructuras de datos de tipo Map.
🟪 ArrayBuffer
Los ArrayBuffer (y tipos relacionados) son estructuras que permiten almacenar grandes volúmenes de información «cruda» en memoria. Esto los hace ideales para el trabajo con datos binarios como manipulación de imágenes o video o tareas donde necesitas manipular información de forma muy eficiente.
Además de ArrayBuffer, también tenemos tipos muy particulares y más específicos donde podemos determinar el tamaño que ocupan en memoria.
Tabla de tipos y tamaños
| Bytes por elemento | ¿Con signo? | Uso | Ejemplos |
|---|---|---|---|
🟦 ArrayBuffer Datos «raw» | N/A | Datos binarios "crudos" | Imágenes, archivos, buffers... |
1️⃣ Int8Array -128 a 127 | Sí | Bytes con signo | Audio PCM, valores negativos en red |
1️⃣ Uint8Array 0 a 255 | No | Bytes sin signo | Imágenes, buffers binarios |
1️⃣ Uint8ClampedArray 0 a 255 | No | Bytes sin signo, con clamping | Píxeles en canvas |
2️⃣ Int16Array -32,768 a 32,767 | Sí | Enteros de 16 bits con signo | Señales de audio, sensores |
2️⃣ Uint16Array 0 a 65,535 | No | Enteros de 16 bits sin signo | Colores RGB, formatos de archivo |
4️⃣ Int32Array -2,147,483,648 a 2,147,483,647 | Sí | Enteros grandes con signo | Cálculos intensivos |
4️⃣ Uint32Array 0 a 4,294,967,295 | No | Enteros grandes sin signo | WebGL, datos de alto rendimiento |
4️⃣ Float32Array ±1.2×10⁻³⁸ a ±3.4×10³⁸ | Sí | Coma flotante (simple) | Gráficos 3D, física básica |
8️⃣ Float64Array ±5.0×10⁻³²⁴ a ±1.8×10³⁰⁸ | Sí | Coma flotante (doble) | Finanzas, simulaciones científicas |
8️⃣ BigInt64Array -2⁶³ a 2⁶³-1 | Sí | Enteros grandes con signo | Identificadores únicos, criptografía |
8️⃣ BigUint64Array 0 a 2⁶⁴-1 | No | Enteros grandes sin signo | Criptografía, dir. de memoria |
