Arrays
## Objetivos de Aprendizaje
- Crear y acceder a arrays
- Usar métodos de array
- Iterar sobre arrays
- Trabajar con arrays multidimensional
## Creando Arrays
### Sintaxis Básica
```javascript
const frutas = ["manzana", "pera", "uva"];
const numeros = [1, 2, 3, 4, 5];
const mixto = [1, "hola", true, null];
const vacio = [];
```
### Constructor
```javascript
const arr1 = new Array(5); // Array vacío de longitud 5
const arr2 = new Array(1, 2, 3); // [1, 2, 3]
```
## Accediendo a Elementos
### Por Índice
```javascript
const frutas = ["manzana", "pera", "uva"];
console.log(frutas[0]); // "manzana"
console.log(frutas[2]); // "uva"
console.log(frutas[frutas.length - 1]); // "uva" (último)
console.log(frutas[10]); // undefined
```
### Modificar Elementos
```javascript
const frutas = ["manzana", "pera", "uva"];
frutas[1] = "plátano";
console.log(frutas); // ["manzana", "plátano", "uva"]
```
## Propiedades y Métodos
### longuitud (length)
```javascript
const numeros = [1, 2, 3, 4, 5];
console.log(numeros.length); // 5
```
### push - Agregar al Final
```javascript
const frutas = ["manzana", "pera"];
frutas.push("uva");
console.log(frutas); // ["manzana", "pera", "uva"]
```
### pop - Eliminar del Final
```javascript
const frutas = ["manzana", "pera", "uva"];
const ultimo = frutas.pop();
console.log(ultimo); // "uva"
console.log(frutas); // ["manzana", "pera"]
```
### unshift - Agregar al Inicio
```javascript
const frutas = ["manzana", "pera"];
frutas.unshift("uva");
console.log(frutas); // ["uva", "manzana", "pera"]
```
### shift - Eliminar del Inicio
```javascript
const frutas = ["manzana", "pera", "uva"];
const primero = frutas.shift();
console.log(primero); // "manzana"
console.log(frutas); // ["pera", "uva"]
```
## Buscar Elementos
### indexOf
```javascript
const frutas = ["manzana", "pera", "uva"];
console.log(frutas.indexOf("pera")); // 1
console.log(frutas.indexOf("uva")); // 2
console.log(frutas.indexOf("kiwi")); // -1
```
### includes
```javascript
const frutas = ["manzana", "pera", "uva"];
console.log(frutas.includes("manzana")); // true
console.log(frutas.includes("kiwi")); // false
```
### find
```javascript
const numeros = [4, 9, 16, 25];
const encontrado = numeros.find(n => n > 10);
console.log(encontrado); // 16
```
### findIndex
```javascript
const frutas = ["manzana", "pera", "uva"];
const indice = frutas.findIndex(f => f === "pera");
console.log(indice); // 1
```
## Modificar Arrays
### splice - Agregar/Eliminar
```javascript
const frutas = ["manzana", "pera", "uva"];
// Eliminar 1 elemento en índice 1
frutas.splice(1, 1);
console.log(frutas); // ["manzana", "uva"]
const frutas2 = ["manzana", "pera", "uva"];
// Insertar en índice 1
frutas2.splice(1, 0, "kiwi", "naranja");
console.log(frutas2); // ["manzana", "kiwi", "naranja", "pera", "uva"]
```
### slice - Extraer Porción
```javascript
const frutas = ["manzana", "pera", "uva", "kiwi"];
const citricos = frutas.slice(1, 3); // índice 1, 2 (no incluye 3)
console.log(citricos); // ["pera", "uva"]
console.log(frutas); // Sin cambios
```
### concat - Combinar
```javascript
const arr1 = [1, 2];
const arr2 = [3, 4];
const combinado = arr1.concat(arr2);
console.log(combinado); // [1, 2, 3, 4]
```
## Ordenar
### sort
```javascript
const numeros = [3, 1, 4, 1, 5, 9, 2, 6];
numeros.sort();
console.log(numeros); // [1, 1, 2, 3, 4, 5, 6, 9]
```
### sort con Función Comparadora
```javascript
const numeros = [3, 1, 4, 1, 5, 9, 2, 6];
numeros.sort((a, b) => a - b); // Ascendente
console.log(numeros); // [1, 1, 2, 3, 4, 5, 6, 9]
numeros.sort((a, b) => b - a); // Descendente
console.log(numeros); // [9, 6, 5, 4, 3, 2, 1, 1]
```
### reverse
```javascript
const frutas = ["manzana", "pera", "uva"];
frutas.reverse();
console.log(frutas); // ["uva", "pera", "manzana"]
```
## Iterar Arrays
### for...of
```javascript
const frutas = ["manzana", "pera", "uva"];
for (const fruta of frutas) {
console.log(fruta);
}
```
### forEach
```javascript
const frutas = ["manzana", "pera", "uva"];
frutas.forEach((fruta, indice) => {
console.log(`${indice}: ${fruta}`);
});
```
## Métodos Funcionales
### map - Transformar
```javascript
const numeros = [1, 2, 3];
const duplicados = numeros.map(n => n * 2);
console.log(duplicados); // [2, 4, 6]
```
### filter - Filtrar
```javascript
const numeros = [1, 2, 3, 4, 5, 6];
const pares = numeros.filter(n => n % 2 === 0);
console.log(pares); // [2, 4, 6]
```
### reduce - Reducir a Un Valor
```javascript
const numeros = [1, 2, 3, 4, 5];
const suma = numeros.reduce((acc, num) => acc + num, 0);
console.log(suma); // 15
```
### find - Encontrar Primero
```javascript
const usuarios = [
{ nombre: "Ana", edad: 28 },
{ nombre: "Juan", edad: 35 }
];
const encontrado = usuarios.find(u => u.nombre === "Ana");
console.log(encontrado); // { nombre: "Ana", edad: 28 }
```
### some y every
```javascript
const numeros = [2, 4, 6, 8];
const algunosPares = numeros.some(n => n % 2 === 0);
console.log(algunosPares); // true
const todosPares = numeros.every(n => n % 2 === 0);
console.log(todosPares); // true
```
## Arrays Multidimensional
### Matriz
```javascript
const matriz = [
[1, 2, 3],
[4, 5, 6],
[7, 8, 9]
];
console.log(matriz[0][0]); // 1
console.log(matriz[1][2]); // 6
```
### Iterar Matriz
```javascript
for (const fila of matriz) {
for (const elemento of fila) {
console.log(elemento);
}
}
```
## Resumen
- Arrays: `const arr = [1, 2, 3]` o `new Array()`
- Acceso: `arr[0]`, `arr[arr.length - 1]`
- push/pop (final), unshift/shift (inicio)
- indexOf, includes, find para buscar
- splice (modificar), slice (extraer), concat (combinar)
- sort (ordenar), reverse (invertir)
- forEach, map, filter, reduce para iterar
- Arrays multidimensionales: matrices anidadas
Comments
Comments powered by Giscus
To enable comments, add your Giscus embed code here.
Learn more about Giscus →