19 - Métodos de Arrays
Estructura inicial
En nuestra carpeta de proyecto crearemos la siguiente estructura:
/
├── js/
│ └── 19-metodos-de-arrays.js
└── index.html
Y un código sencillo para nuestro HTML:
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="./js/19-metodos-de-arrays.js"></script>
<title>19 - Métodos de Arrays</title>
</head>
<body>
<h1>Temario de JavaScript</h1>
</body>
</html>
Método forEach()
Permite recorrer todos los elementos de un Array:
let frutas = ["Piña", "Manzana", "Limón", "Cerezas"]
/* fruta es el nombre del elemento e index el índice de ese elemento (este último puede omitirse si no lo vamos a usar). */
frutas.forEach((fruta, index) => {
console.log(`La fruta ${index} es ${fruta}.`)
//La fruta 0 es Piña.
//...
//La fruta 3 es Cerezas.
})
Método for(in)
Al igual que forEach()
, permite recorrer todos los elementos de un Array:
let lenguajes = ["JavaScript", "PHP", "C++", "C#"]
for(lenguaje in lenguajes) {
console.log(lenguajes[lenguaje]) //JavaScript, PHP...
}
Método map()
Permite recorrer todos los elementos de un Array y hacer cambios que podemos guardar en un nuevo Array:
let nums = [3, 5, 7, 2, 9]
/* Nota: map() también tiene un parámetro opcional para el índice */
let nums2 = nums.map((num) => {
num * 2
})
console.log(num2) //6, 10, 14, 4, 18
Método findIndex()
Devuelve el índice de un elemento de un Array:
let asignaturas = [
"Lengua",
"Matemáticas",
"Inglés",
"Física",
"Historia",
"Geografía"
]
let indiceHistoria = asignaturas.findIndex((asignatura) => {
asignatura === "Historia"
})
console.log(indiceHistoria) //4
Nota: Si no encuentra resultados, el índice será -1
Método some()
Devuelve si el elemento o elementos cumplen alguna condición específica o no en el Array
let asignaturas = [
"Lengua",
"Matemáticas",
"Inglés",
"Física",
"Historia",
"Geografía"
]
let notas = [4, 6, 2, 5, 1]
let existeLengua = asignaturas.some((asignatura) => {
asignatura === "Lengua"
})
let notables = notas.some((nota) => {
nota >= 7
})
console.log(existeLengua) //True
console.log(notables) //False
Método sort()
Permite ordenar un Array por orden ascendente y descendente:
let alumnos = ["Paco", "Luisa", "Miguel", "David", "Megan", "Jara"]
let nums = [5, 7, 8, 2, 54, 28]
/* Si no indicamos ningún parámetro tendrá en cuenta el orden alfabético */
let alumnosAsc = alumnos.sort()
console.log(alumnosAsc) //['David', 'Jara', 'Luisa', 'Megan', 'Miguel', 'Paco']
/* Con una función callback con parámetros a y b podemos ordenar un Array numérico */
let nums_ascendente = nums.sort((a, b) => a - b)
console.log(nums_ascendente) //[2, 5, 7, 8, 28, 54]
let nums_descendente = nums.sort((a, b) => b - a)
console.log(nums_descendente) //[54, 28, 8, 7, 5, 2]
Método push()
Permite añadir un elemento nuevo al Array:
let capitales = ["Madrid", "Lisboa", "París", "Londres"]
console.log(capitales) //["Madrid", "Lisboa", "París", "Londres"]
capitales.push("Tokio")
console.log(capitales) //["Madrid", "Lisboa", "París", "Londres", "Tokio"]
Método splice()
Permite eliminar un elemento de nuestro Array:
let capitales = ["Madrid", "Lisboa", "París", "Londres", "Tokio"]
console.log(capitales) //["Madrid", "Lisboa", "París", "Londres", "Tokio"]
/* Hay que indicar el índice inicial y el número de elementos a eliminar */
capitales.splice(0, 1)
console.log(capitales) //[Lisboa", "París", "Londres", "Tokio"]
capitales.splice(2, 2) //Eliminamos dos elementos
console.log(capitales) //[Lisboa", "París"]