Algunos métodos de array recientemente introducidos en JavaScript ES6

Una array se utiliza para almacenar los elementos de múltiples tipos de datos en JavaScript por completo. Además, hay ciertos momentos en los que debe manipular la respuesta recibida de las API según los requisitos de las páginas web. A veces, las respuestas son objetos y deben convertirse en arrays para realizar las operaciones deseadas. Estos métodos de manipulación de arrays pueden ahorrarle tiempo.

1. Método map(): itera sobre cada elemento de la array y aplica alguna condición funcional y devuelve la nueva array. No cambia la array principal pero devuelve la nueva array de valores transformados. Además, utiliza la notación abreviada de la función de flecha para disminuir el código en una sola línea.

   JavaScript

   var abc = [10, 20, 30, 40, 50]; let xyz = abc.map(res => res * 2); console.log("The main array: ", abc); console.log("The modified array: ", xyz);

   Producción:

   The main array:  [10, 20, 30, 40, 50]
   The modified array: [20, 40, 60, 80, 100]
   

2. Método Filter(): Este método es útil cuando se quiere encontrar los elementos que pasan una determinada condición. Itera sobre todos los elementos y devuelve una array con los que cumplen la condición.
   Además, no muta la array principal y crea una nueva.

   JavaScript

   let abc =[10, 20, 30, 40, 50]; let xyz = abc.filter(res => res > 35); console.log("The main array: ", abc); console.log("The modified array: ", xyz);

   Producción:

   The main array : [10, 20, 30, 40, 50]
   The modified array: [40, 50]
   

   Nota: El método filter() es ampliamente compatible en IE porque pertenece a ES5 y find() se introdujo en ES6, por lo que solo los navegadores más recientes (IE 11) son compatibles con él.

3. Método Find(): este método se puede usar cuando desea encontrar el elemento que pasa una determinada condición. Esto es muy similar al método filter() pero devuelve el primer elemento que satisface la condición y no itera más.

   JavaScript

   let abc = [10, 20, 30, 40, 50]; let xyz = abc.find(res => res > 35); console.log("The main array: ", abc); console.log("The modified array: ", xyz);

   Producción:

   The main array: [10, 20, 30, 40, 50] 
   The modified array: [40]
   

4. Método Reduce(): esta función es útil cuando desea reducir todos los elementos de la array a un solo valor. Se puede usar para averiguar simplemente la suma de todos los elementos en una array.

   JavaScript

   let abc =[10, 20, 30, 40, 50]; let xyz = abc.reduce((element, iterator)=>iterator+element, 0); console.log("The addition is: ", xyz);

   Producción:

   The addition is: 150
   

   Además, también puede inicializar el valor de la variable del elemento a algún otro valor.

   JavaScript

   let abc = [10, 20, 30, 40, 50];    let xyz = abc.reduce((element, iterator)            => iterator + element, 2000);    console.log("The main array: ", abc);   console.log("The addition is: ", xyz);

   Producción:

   The main array: [10, 20, 30, 40, 50]
   The addition is: [2150]