Arrays

Los arrays (o arreglos) son una estructura de datos 🗂️ fundamental que permite almacenar múltiples valores 📦 en una sola variable. Utilizan índices numéricos para acceder a sus elementos.

¿Qué es un array?

Un array es una colección ordenada de elementos 🔢 que pueden ser de cualquier tipo:

Números 🔢
Cadenas de texto 📝
Booleanos ✅/❌
Funciones 🛠️
¡Incluso otros arrays! 🔄

Además, son dinámicos, es decir, pueden cambiar de tamaño y mezclar tipos de datos sin problema.

🎨 Declaración

Hay dos formas de crear un array vacío:

let arr = new Array(); // Forma 1
let arr = []; // Forma 2 (la más usada 💡)

Con elementos iniciales:

let frutas = ["🍎", "🍊", "🍐"];

Para acceder a los elementos, usamos índices (comienzan en 0):

alert(frutas[0]); // 🍎
alert(frutas[1]); // 🍊

Cambiar o agregar elementos:

frutas[2] = "🍌"; // Ahora ["🍎", "🍊", "🍌"]
frutas[3] = "🍇"; // Ahora ["🍎", "🍊", "🍌", "🍇"]

La longitud del array (length) te dice cuántos elementos tiene:

console.log(frutas.length); // 4

🔄 Recorriendo arrays

Unidimensionales (vectores 🚗)

Bucle for clásico:

let numeros = [1, 2, 3, 4, 5];

for (let i = 0; i < numeros.length; i++) {
  console.log(numeros[i]);
}
// Salida: 1, 2, 3, 4, 5

forEach:

numeros.forEach((numero) => console.log(numero));

for…of (más elegante ✨):

for (let numero of numeros) {
  console.log(numero);
}

Multidimensionales (matrices 🎲)

Bucle anidado clásico:

let matriz = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9],
];

for (let i = 0; i < matriz.length; i++) {
  for (let j = 0; j < matriz[i].length; j++) {
    console.log(matriz[i][j]);
  }
}

forEach:

matriz.forEach((fila) => fila.forEach((elemento) => console.log(elemento)));

for…of:

for (let fila of matriz) {
  for (let elemento of fila) {
    console.log(elemento);
  }
}

🔥 Métodos de arrays y cómo funcionan

Los métodos de arrays son funciones incorporadas que nos facilitan trabajar con ellos. Algunos modifican el array original (mutables 🔄), mientras que otros crean un nuevo array (inmutables ✨). Aquí va una lista explicada:

Modificar el array (Métodos mutables)

push(...items) - Agregar al final

Este método añade un elemento (o varios) al final del array. El tamaño del array aumenta.

let frutas = ["🍎", "🍊"];
frutas.push("🍌");
console.log(frutas); // ["🍎", "🍊", "🍌"]

💡 Devuelve: La nueva longitud del array.

pop() – Quitar el último

Remueve el último elemento del array y lo devuelve (ideal para pilas).

let frutas = ["🍎", "🍊", "🍌"];
let ultima = frutas.pop();
console.log(frutas); // ["🍎", "🍊"]
console.log(ultima); // "🍌"

💡 Devuelve: El elemento eliminado.

shift() – Quitar el primero

Elimina el primer elemento del array y lo devuelve. ¡Adiós al inicio!

let frutas = ["🍎", "🍊", "🍌"];
let primera = frutas.shift();
console.log(frutas); // ["🍊", "🍌"]
console.log(primera); // "🍎"

💡 Devuelve: El elemento eliminado.

unshift() – Agregar al inicio

Añade uno o más elementos al principio del array.

let frutas = ["🍊", "🍌"];
frutas.unshift("🍓", "🍍");
console.log(frutas); // ["🍓", "🍍", "🍊", "🍌"]

💡 Devuelve: La nueva longitud del array.

splice() – Cortar, agregar o reemplazar

El método más versátil 🔥. Permite:

Eliminar elementos.
Insertar elementos.
Reemplazar elementos.

let frutas = ["🍎", "🍊", "🍌", "🍇"];
// Eliminar "🍊" y "🍌"
let eliminados = frutas.splice(1, 2);
console.log(frutas); // ["🍎", "🍇"]
console.log(eliminados); // ["🍊", "🍌"]

// Insertar "🍓" y "🥭" en la posición 1
frutas.splice(1, 0, "🍓", "🥭");
console.log(frutas); // ["🍎", "🍓", "🥭", "🍇"]

💡 Parámetros:

Posición inicial (índice).
Cantidad de elementos a eliminar.
Elementos a agregar (opcional).

sort() – Ordenar

Ordena los elementos in-place según su valor Unicode (¡ojo con los números!).

let letras = ["d", "a", "c", "b"];
letras.sort();
console.log(letras); // ["a", "b", "c", "d"]

let numeros = [10, 5, 20, 1];
numeros.sort((a, b) => a - b);
console.log(numeros); // [1, 5, 10, 20]

💡 Devuelve: El array ordenado (mutado).

✨ Crear nuevos arrays (Métodos inmutables)

map() – Transformar elementos

Aplica una función a cada elemento y devuelve un nuevo array con los resultados.

let numeros = [1, 2, 3, 4];
let cuadrados = numeros.map((num) => num * num);
console.log(cuadrados); // [1, 4, 9, 16]

💡 Devuelve: Un nuevo array con los elementos transformados.

filter() – Filtrar elementos

Crea un nuevo array con los elementos que cumplen una condición.

let numeros = [10, 15, 20, 25];
let mayores = numeros.filter((num) => num > 15);
console.log(mayores); // [20, 25]

💡 Devuelve: Un array con los elementos que pasaron el filtro.

reduce() – Reducir a un valor

Combina todos los elementos del array en un solo valor usando una función.

let numeros = [1, 2, 3, 4];
let suma = numeros.reduce((acum, num) => acum + num, 0);
console.log(suma); // 10

💡 Parámetros:

acum: Acumulador (inicia con el valor que le pases).
num: Elemento actual del array.

slice() – Copiar una parte

Extrae una sección del array y devuelve un nuevo array sin modificar el original.

let frutas = ["🍎", "🍊", "🍌", "🍇"];
let algunas = frutas.slice(1, 3);
console.log(algunas); // ["🍊", "🍌"]
console.log(frutas); // ["🍎", "🍊", "🍌", "🍇"]

💡 Parámetros:

Índice de inicio (incluido).
Índice final (excluido).

concat() – Combinar arrays

Une dos o más arrays en uno nuevo.

let frutas1 = ["🍎", "🍊"];
let frutas2 = ["🍌", "🍇"];
let todas = frutas1.concat(frutas2);
console.log(todas); // ["🍎", "🍊", "🍌", "🍇"]

💡 Devuelve: Un nuevo array combinado.

includes() – ¿Está en el array? Verifica si un elemento existe en el array.

let frutas = ["🍎", "🍊", "🍌"];
console.log(frutas.includes("🍊")); // true
console.log(frutas.includes("🍓")); // false

💡 Devuelve: true o false.