Guías de Make it Real
Search…
Programación funcional
La programación funcional es un paradigma de la programación en donde las funciones se convierten en las protaginistas del código que escribimos.
Un paradigma de la programación es una forma de pensar en programación. Otros paradigmas de la programación incluyen la programación imperativa (de la que vamos a hablar en un momento) y la programación orientada por objetos. Estos paradigmas no son excluyentes y se pueden mezclar.
Aunque JavaScript no es un lenguaje puramente funcional, sí es posible programar de forma funcional. En JavaScript las funciones tienen las siguientes características:
- Se pueden asignar a variables.
- Se pueden pasar como parámetro de otras funciones (callbacks).
- Se pueden retornar desde otras funciones.
Funciones nombradas vs anónimas
En JavaScript las funciones pueden tener un nombre o ser anónimas:
1
// esta es una función nombrada
2
function namedFn() {}
3
4
// esta es una función anónima que estamos almacenando en una variable
5
const anonymousFn = function() {}
Copied!
Las funciones anónimas se utilizan cuando queremos asignarlas a variables y, en algunas ocasiones, para pasarlas como parámetros de otras funciones o retornarlas desde otra función.
Funciones que reciben funciones
Un lenguaje funcional, a diferencia de un lenguaje imperativo, nos permite componer funciones para solucionar diferentes tipos de problemas. A estas funciones también se les conoce como funciones de alto nivel (high order functions).
Por ejemplo, imagina que tenemos el siguiente arreglo:
1
const arr = [1, 2, 3];
Copied!
Ahora queremos imprimir todos sus elementos. En programación imperativa lo haríamos de la siguiente forma:
1
for (let i=0; i < arr.length; i++) {
2
console.log(arr[i]);
3
}
Copied!
En programación funcional utilizaríamos una función llamada
forEach que viene incluída por defecto en todos los arreglos de JavaScript:1
const sum = arr.forEach(elem => console.log(elem));
Copied!
Más compacto ¿no?. Por debajo
forEach utiliza for para hacer el recorrido de los elementos. No es que la programación funcional reemplace la programación imperativa, la programación funcional está un nivel por encima de la programación imperativa.Map
Otro método útil que traen todos los arreglos en JavaScript es
map, que nos permite transformar cada uno de los elementos de un arreglo. Por ejemplo, imagina que queremos duplicar todos los valores de arr:1
const newArr = arr.map(elem => elem * 2);
2
3
// newArr sería [2, 4, 6]
Copied!
Lo interesante de las funciones es que se pueden anidar para crear código muy sutil. Por ejemplo, el siguiente código duplicaría cada elemento del arreglo y después imprimiría cada elemento duplicado.
1
arr
2
.map(elem => elem * 2)
3
.forEach(elem => console.log(elem));
Copied!
Separé el código en varias líneas para que sea más fácil de leer. Esto es una buena práctica cuando se anidan funciones.
Reduce
Otra operación muy útil con los arreglos es convertirlos en algo completamente diferente, por ejemplo sumar todos los elementos, o crear un objeto a partir de un arreglo. A esto se le conoce en programación como reducirlos.
En JavaScript todos los arreglos tienen un método
reduce que se utiliza precisamente para esto. Por ejemplo, si queremos sumar todos los elementos en arr podemos hacer lo siguiente:1
const sum = arr.reduce((acc, elem) => acc + elem);
2
console.log(sum); // 6
Copied!
reduce recibe un callback (una función) y, opcionalmente, un valor inicial. El callback recibe dos parámetros: un acumulador y un elemento. Lo que retorne el callback se va a utilizar como el acumulador del siguiente elemento. En nuestro caso vamos acumulando la suma.También podemos utilizar
reduce para operaciones un poco más complejas. Por ejemplo para contar cuantas veces se repite cada caracter en una cadena de texto:1
const input = "Make it real"
2
const response = input.split('').reduce((acc, now) => {
3
acc[now] ? acc[now] ++ : acc[now] = 1;
4
return acc;
5
}, {})
6
7
console.log(response) // { M: 1, a: 2, k: 1, e: 2, ' ': 2, i: 1, t: 1, r: 1, l: 1 }
Copied!
El
split hace que la cadena se convierta en un arreglo que podemos utilizar para contar las letras (utilizando el reduce). Al reduce le estamos pasando un objeto vacío como valor inicial (línea 5). En cada iteración del reduce verificamos si la letra existe como propiedad del objeto. Si existe, le sumamos 1 a esa propiedad, de lo contrario la creamos y le asignamos el valor 1. Por último retornamos el objeto actualizado.Funciones que retornan funciones
La capacidad de retornar una función de otra función es una característica fundamental de la programación funcional que nos permite crear soluciones reutilizables a problemas comunes.
Veamos cómo crear y utilizar una función que retorne otra función:
1
function hello(name) {
2
return function() {
3
console.log(`Hola ${name}`)
4
}
5
}
6
7
const helloMaria = hello("Maria")
8
helloMaria() // "Hola Maria"
9
10
// o más compacto
11
hello("Pedro")() // "Hola Pedro"
Copied!
La función
hello recibe un argumento (un nombre) y retorna una nueva función. En la línea 7 estamos almacenando la función retornada en una variable llamada helloMaria que después invocamos. También es posible evitarnos la asignación a una nueva variable e invocar la función retornada inmediatamente como lo hacemos en la línea 11.En la práctica es poco probable que necesites crear una función que retorne otra función, es más común que las utilices en librerías o incluso en el mismo lenguaje.
Por ejemplo, el método
bind (explicado en la guía Uso del this) retorna otra función que garantiza que la función original siempre se ejecute en el contexto adecuado.1
// asumiendo que Lodash está incluido
2
const calculate = _.once(function() {
3
// realiza un calculo complejo y retorna un resultado
4
})
5
6
calculate()
7
calculate() // no ejecuta la función nuevamente, retorna el resultado anterior
Copied!
1
function once(fn) {
2
let called = false
3
let result
4
5
return function() {
6
if (!called) {
7
called = true
8
result = fn()
9
}
10
return result
11
}
12
}
Copied!
Primero definimos dos variables:
called que nos va a decir si la función ya se invocó y result en donde vamos a almacenar el resultado de la función. Después retornamos una nueva función que hace todo el trabajo pesado: si la función no ha sido invocada la invoca, cambia called a true y almacena el resultado en result. Por último, en la línea 10, retornamos el resultado.Funciones puras
Las funciones puras son funciones que cumplen con las dos siguientes condiciones:
- Retornan el mismo valor si se les pasan los mismos argumentos.
- No tienen efectos secundarios (como imprimir en la console, escribir a la red o al disco, etc.).
En la práctica no es posible crear una aplicación a partir de funciones puras únicamente, pero es bueno saber qué es y qué no es una función pura.
El principal beneficio de las funciones puras es que nos permiten escribir pruebas unitarias más fácilmente.
Inmutabilidad
Otro principio importante en la programación funcional es el de inmutabilidad, que dice que las variables, objetos y arreglos no se deberían modificar una vez han sido creados. Eso implica utilizar siempre
const en el caso de variables y crear un nuevo arreglo u objeto cuando se necesite modificarlos.En JavaScript todos los strings son inmutables (no pueden ser modificados). Todos los métodos sobre los strings devuelven nuevos strings. Por ejemplo:
1
const str = "Este string es inmutable"
2
const str2 = str.slice(5, 11)
3
const str3 = str2.toUpperCase()
4
5
console.log(str) // "Este string es inmutable"
6
console.log(str2) // "string"
7
console.log(str3) // "STRING"
Copied!
Lo más importante de este ejemplo es que
str nunca cambia, los métodos slice y toUpperCase retornan nuevos strings.Los arreglos y objetos, por otro lado, son mutables (se pueden modificar).
Los arreglos tienen algunos métodos que mutan (modifican) el arreglo (p.e.
push, shift y splice) y otros que retornan un nuevo arreglo (p.e. concat, map y filter).Para modificar un arreglo de forma inmutable se recomienda crear un nuevo objeto:
1
const obj = { a: 1, b: 2, c: 3 }
2
const newObj = { ...obj, c: 4, d: 5}
3
// newObj queda { a: 1, b: 2, c: 4, d: 5}
Copied!
La ventaja principal de la inmutabilidad es que permite crear programas que son más fácil de entender y mantener. En programas pequeños esto no es muy relevante, pero a medida que los programas crecen se vuelve más importante.
Last modified 2yr ago