Javascript map

El método map devuelve un nuevo array que contendrá el resultado de haber llamado a una función por cada uno de los elementos de otro array.

Por ejemplo, la siguiente llamada al método map genera un nuevo array cuyo valor es el doble del valor correspondiente del array original:

const numeros = [1, 2, 3];
const nuevoArray = numeros.map(valor => multiplicarPor2(valor));
console.log(nuevoArray); // 2, 4, 6

function multiplicarPor2(valor) {
    return valor * 2
}

Si utilizamos una función anónima para limpiar un poco más nuestro código, quedaría así

const numeros= [1, 2, 3];

const nuevoArray = numeros.map(value => value * 2);

console.log(nuevoArray); // 2, 4, 6

Recorrer elementos del DOM HTML con map

Con el método map podremos recorrer arrays. Sin embargo, las etiquetas HTML de una página web no son un array, sino un nodelist, por lo que habrá que hacer la siguiente conversión:

const elements = document.querySelectorAll('div');

Array.from(elements).map(obj => {
    console.log(obj.innerHTML)
});

Ejercicios: Arrays

1. Crea un array con cinco nombres de persona y recórrelo mostrando el texto “Conozco a alguien llamado “.

2. Recorrer la siguiente lista con un bucle imprimiendo el doble de cada número:

my_list = [1,9,3,8,5,7]

3. Contar el número de elementos positivos, negativos y que valgan cero en un array de 10 enteros. Los valores habrán sido harcodeados en un array.

4. Leer 10 enteros harcodeados en un array y mostrar la media de los valores negativos y la de los positivos.

← foreach en Javascript
Cómo hacer un slider →

Aviso Legal | Política de privacidad