La Iteración del JavaScript Moderno.

Para los que llegaron tarde a clases esa semana de mediados de aquel Abril, un bucle o ciclo en programación es una secuencia que ejecuta repetidas veces un trozo de código, hasta que la condición asignada a dicho bucle deja de cumplirse. Los tres bucles más utilizados en programación son el bucle while, el bucle for y el bucle do-while.

Hay muchos tipos diferentes de bucles, pero todos esencialmente hacen lo mismo: repiten una acción varias veces. Los bucles ofrecen una forma rápida y fácil de hacer algo repetidamente. Por ejemplo, aquella pregunta de la maestra de matemáticas de la primaria cuando nos pedía con insistencia “Multiplicar los primeros 12 números por 9” podría calcularse a escondidas de ella usando un clásico bucle o ciclo FOR:

Método Tradicional para un bucle - For Loop

Los diversos mecanismos de bucle ofrecen diferentes formas de determinar los puntos de inicio y finalización del bucle. Hay varias situaciones a las que un tipo de bucle sirve más fácilmente que los demás.

Estudiando estas circunstancias algunos se preguntarán: Si las declaraciones para los bucles proporcionados en JavaScript ya son buenos y suficientes para cumplir las tareas, entonces porqué diablos deberíamos cambiarlos por los modernos ciclos o bucles de tipo funciones de alto orden? Para responder esta pregunta, primero debemos entender que son estas funciones.

Una función de alto orden, o Higher Order Function, es una eficaz y potente abstracción muy característica de los lenguajes de programación funcionales, los cuales tratan a las funciones como ciudadanos de primera clase (first-class citizens) lo cual es meramente fascinante, pero … ¿qué significa eso? ¿Por qué esto es importante para los desarrolladores de la era moderna?

Esto significa que dichas funciones son objetos los cual nos da la posibilidad de que se puedan asignar como variables, ser utilizadas como parámetros o simplemente ser el asignadas como valores de retorno de funciones alternas.

En el siguiente código implementaremos una rutina que envuelva un ciclo y esto lo haremos con el FOR tradicional y luego implementaremos un bucle con uno de los métodos de Función de Alto Orden [HOF en inglés], en este caso, un Filter().

En este ejemplo tenemos un array con varios de los frameworks y librerías más famosos de JavaScript. Quiero obtener solamente los que sean de tipo “framework”. La forma mas común y conocida es la primera con el ciclo for que itera sobre cada elemento del array javaScriptWorld y agrega a un nuevo array myFrameworkUsingFor los items que sean de elemento framework.

Analizando el segundo al usar el método HOF llamado Filter vemos acepta una función como parámetro. Este tipo de funciones son Callbacks. Filter iterará en cada elemento del array javaScriptWorld y pasará cada elemento dentro del callback. Lo que hace es que espera una respuesta del callback, siendo true si se cumple con el código dentro de la función o false en caso de que no se cumpla. Si es true, el elemento del array será agregado al nuevo array myFrameworkUsingFilter.

Al parangonar estas dos funciones notamos que filter usa mucho menos código que el bucle for. La razón es que cuando escribimos nuestro código en pequeñas funciones, estas se compaginan entre sí. Lo que permite re utilizar las funciones en el resto del código. Esta es una de las ventajas de usar los métodos de higher Order Function[HOF], veamos entonces algunos de ellos con un poco más de detalle en sus funcionalidades.

Métodos modernos usando Higher Order Function

Vamos ver unos ejemplos de funciones de alto orden, una para generar enteros random y la otra para hacer la misma multiplicación que hicimos anteriormente con un ciclo FOR pero de manera un poco más vanguardista.

Método map()

Este método crea una nueva matriz poblada con los resultados de llamar a una función proporcionada en cada elemento de la matriz que llama.

Nota: Si estás usando map para tus bucles, no puedes usar break, continue o return mientras realizas un bucle. Para este caso, debes usar los métodos every o some. Esta fue una buena lección que aprendi experimentando con every.

Método forEach()

Ejecuta una función proporcionada una vez para cada elemento de la matriz. En este ejemplo, forEach() nos regresa cada item del arrNames concatenado al apellido Hunter.

Método every()

Prueba si todos los elementos de la matriz pasan la prueba implementada por la función proporcionada. Devuelve un valor de tipo boolean. En este ejemplo, si los precios por celular son mayores que 200, every() nos retornara un true, sino obviamente un false.

Método some()

Prueba si al menos un elemento de la matriz pasa la prueba implementada por la función proporcionada. Este también devuelve un valor tipo boolean. Es Batman un superheroe? si lo es y esta en el array, el método some() nos regresara un true, sino pues un false.

Método find()

Devuelve el valor del primer elemento en la matriz proporcionada que satisface la función de prueba proporcionada. En este ejemplo hacemos la búsqueda del titulo Web Developer si está, find() lo regresa sino simplemente lo manda undefined.

Método includes()

Determina si una matriz incluye un cierto valor entre sus entradas, devolviendo verdadero o falso según corresponda. Include nos regresara un elemento boolean dependiendo si el parámetro se encuentra o no en el arreglo.

Método filter()

Crea una nueva matriz con todos los elementos que pasan la prueba implementada por la función proporcionada. Acá Filter() nos retorna un arreglo con los apellidos con más de 6 caracteres de largo.

Método reduce()

Ejecuta una función reductora (que usted proporciona) en cada elemento de la matriz, lo que da como resultado un valor de salida único. En este ejemplo, el método reduce() calcula la suma de todos los items de arrSuma y luego suma cada uno de ellos con un 5 en el 2do ejemplo.

Complementando todos estos ejemplos, ahora les proporciono el código fuente que he preparado para cada uno de los bucles antes mencionados para los ejemplos anteriores con métodos de Higher Order Function.

Para finalizar, cerramos con un ejemplo ya aplicando todas estas funciones y métodos Higher Order Functions trabajando en un calculo de notas escolares.

Thanks for reading this article, I hope you enjoyed it as much as I did writing it. Until next time, dear readers!

👍 Your enjoyment of this article encourages me to write further.

🤔 Kindly share your valuable opinion by leaving a comment.

🔗 If this article has truly helped you, please share it.