Lección 6: Array
Hay una variable puede contener más de un valor. Técnicamente es una estructura de datos que puede contener una colección de valores. O, en otras palabras, una variable que guarda una lista de otras variables. A esta característica se le denomina: array.
Crear
Un array vacío denominado semana.
// Vacío
const semana = [];
A continuación puedes ver un array relleno con los días de la semana.
// Lleno
const semana = ['lunes', 'martes', 'miércoles', 'jueves', 'viernes', 'sábado', 'domingo'];
Leer
Para obtener un valor del array debes usar su posición envuelta en corchetes [] o la función at. Se empieza a contar por 0.
const semana = ['lunes', 'martes', 'miércoles', 'jueves', 'viernes', 'sábado', 'domingo'];
console.log(semana[0]);
// lunes
console.log(semana.at(0));
// lunes
Si quiero el segundo, usaré 1.
console.log(semana[1]);
// martes
console.log(semana.at(1));
// martes
Incluso puedes capturar usando valores usando índices negativos, aunque solo con at. Supongamos que quieres obtener el último elemento del array pero desconoces la longitud.
console.log(semana.at(-1));
// domingo
¿Y el penúltimo?
console.log(semana.at(-2));
// sábado
Longitud
Debes usar la variable length, que se encuentra dentro del array.
console.log(semana.length);
// 7
Añadir
Puedes concadenar el array con un nuevo valor, guardando el resultado en una nueva variable o sobrescribiendo el array original.
const dosMeses = meses.concat("Febrero");
console.log(dosMeses);
// ["Enero", "Febrero"]
console.log(meses);
// ["Enero"]
Otra opción es modificar el array con la función push().
let meses = ["Enero"];
meses.push("Febrero");
// 2
console.log(meses);
// ["Enero", "Febrero"]
Te devolverá la longitud del array.
¿Cual deberías utilizar? Depende de si trabajas mutando (modificando) las variables o no.
Eliminar
Primer elemento
Una estrategia es crear un array nuevo sin el primer elemento. Para ello podemos usar slice(1), clonará desde la posición que deseemos. En este caso de la primera en adelante.
const semana = ["lunes", "martes", "miércoles", "jueves", "viernes", "sábado", "domingo"];
const semanaSinLunes = meses.slice(1);
// ["martes", "miércoles", "jueves", "viernes", "sábado", "domingo"]
Otra posibilidad es mutando el array con shift().
let semana = ["lunes", "martes", "miércoles", "jueves", "viernes", "sábado", "domingo"];
semana.shift();
console.log(semana);
// ["martes", "miércoles", "jueves", "viernes", "sábado", "domingo"]
Último elemento
Podemos volvemos a utilizar slice. En este caso clonaremos desde la posición 0 a la penúltima (-1 o semana.length - 1).
const semana = ["lunes", "martes", "miércoles", "jueves", "viernes", "sábado", "domingo"];
const semanaSinDomingo = semana.slice(0, -1);
console.log(semanaSinDomingo);
// ["lunes", "martes", "miércoles", "jueves", "viernes", "sábado"]
En caso de modificar el array, podemos usar pop().
let semana = ["lunes", "martes", "miércoles", "jueves", "viernes", "sábado", "domingo"];
semana.pop();
console.log(semana);
// ["lunes", "martes", "miércoles", "jueves", "viernes", "sábado"]
Posición concreta
En los ejemplos eliminaremos sábado, que ocupa la posición 5.
Sin modificar el array original podemos realizar un filtrado con filter.
const semana = ["lunes", "martes", "miércoles", "jueves", "viernes", "sábado", "domingo"];
const semanaSinSabado = semana.filter(function (valor, posicion) {
return posicion !== 5
});
console.log(semanaSinSabado);
// ["lunes", "martes", "miércoles", "jueves", "viernes", "domingo"]
Si quieremos modificinar el array, disponemos de splice (no confundir con slice). El primer argumento es la posición y el segundo la cantidad de elementos a eliminar (en el ejemplo será 1).
let semana = ["lunes", "martes", "miércoles", "jueves", "viernes", "sábado", "domingo"];
semana.splice(5, 1);
console.log(semana);
// ["lunes", "martes", "miércoles", "jueves", "viernes", "domingo]
Avanzado
Funciones de Transformación, Conversión y Comprobación
Hay una serie de funciones que te serán de mucha ayuda para gestionar arrays.
- filter
- reduce
- map
- fill
- find
- includes, busca si existe un elemento dentro de un
array. - some, te dice si un
arraycumple la condición en algún momento. - every, igual que
somepero debe cumplirse siempre. - forEach, recorre un
arrayobteniendo su posición y valor.
Puedes leer un resumen en el siguiente artículo de javascript funcional.
Set (Conjuntos)
Para evitar repeticiones dentro de un array puedes usar una herramienta creada con ese fin, el objeto Set(). El propósito no es sustituir el array sino evitar repeticiones cuando se añaden valores nuevos e informarte si ya existe. ¡Nada más!
Crear
Utiliza new Set().
let setPelis = new Set();
O parte con valores de un array.
let setPelis = new Set(["Lo que el viento se llevó", "La gran evasión"]);
Leer
No tiene sentido ser leído, ya que su objetivo es informarte si un elemento ya existe o evitar repeticiones, no recuperar valores por índices.
Longitud
Usa el valor size.
let setPelis = new Set(["Lo que el viento se llevó", "La gran evasión"]);
console.log(setPelis.size)
// 2
Añadir
Disponemos de una función llamada add().
let setPelis = new Set();
setPelis.add("Lo que el viento se llevó")
setPelis.add("Lo que el viento se llevó")
setPelis.add("La gran evasion")
console.log(setPelis)
// ["Lo que el viento se llevó", "La gran evasión"]
Comprobar si existe
Puedes usar has() con el valor que quieres comprobar en su parámetro de entrada.
let setPelis = new Set(["Lo que el viento se llevó", "La gran evasión"]);
console.log(setPelis.has("La gran evasion"))
// true
Eliminar
Puedes quitar valores usando delete() indicando como parámetro de entrada que deseas quitar.
let setPelis = new Set(["Lo que el viento se llevó", "La gran evasión"]);
setPelis.delete("La gran evasión");
console.log(setPelis)
// ["Lo que el viento se llevó"]
Actividad 1
Crea un array con productos e imprímelos por consola.
Actividad 2
Calcula la media de las siguientes notas
const notas_1 = [1, 7, 3];
const notas_2 = [9, 6, 2];
Actividad 3
A partir del siguiente array.
const lista_numeros = [2, 1, 6, 7, 6, 3];
- Suma todos los números.
- Imprime un número aleatorio de la lista.
- Borra el primer número.
- Borra el último número.
- Vuelve a sumarlos.
- Añade un 5.
- Vuelve a sumarlos.
Actividad 4
Elimina, o crea un nuevo array de todos los dominios que no tengan la letra h.
const lista_dominios = ["hbo.com", "bbc.uk", "ebay.com", "hulu.com", "reddit.com", "adobe.es", "google.com", "huffingtonpost.com"];
Actividad 5
Crea una función que te devuelva pistas sobre una palabra a adivinar.
Las reglas serán las siguientes.
- Las palabras serán siempre de 5 letras.
- Si la letra coincide: 🟩
- Si la letra existe, pero no esta en el lugar adecuado: 🟨
- Si la letra no existe: ⬛
Ejemplo:
const solucion = "coche";
palabraSugerida("roble", solucion);
// ⬛🟩⬛⬛🟩
palabraSugerida("techo", solucion);
// ⬛🟨🟩🟩🟨
palabraSugerida("coche", solucion);
// 🟩🟩🟩🟩🟩
Esta obra está bajo una Licencia Creative Commons Atribución-NoComercial-SinDerivadas 4.0 Internacional.
¿Me invitas a un café? ☕
Puedes hacerlo usando el terminal.
ssh customer@andros.dev -p 5555
Comentarios
Nuevo comentario
Nueva replica {{ formatEllipsisAuthor(replyComment.author) }}
Escribe el primer comentario
{{ comments.length }} comentarios