Let’s keep on learning ES6 features, and after the first entrance on a few tips, today’s lesson is dedicated to arrow functions. The concept behind this functions are sintax reduce, they are anonimous functions, no bind with “this”, and always returning a value.
They are defined with an arrow:
() => { }
The sintax is simple:
let test = () => 'test'; let test2 = item => item; let test3 = (item, item2) => item + item2;
and it can be equal to:
let test = function() { return 'test'; }
let test2 = function(item) { return item} ;
let test3 = function(item, item2) { return item + item2; }
As you can verify, the sentences are shorter, and easier to read, although the sintax depends on how paramaters the functions needs (in case it needs). By default, a value is always returned, although you don’t need to specify return.
Another aspect related to arrow functions are that this functions cannot be used as constructor, becuase it will raise an error: let test4 = new test2();
When to use them
Mainly, when you need simple functions that always return a velue. It is very useful when working with arrays, and you want to apply the same function to all elements.
It is also very handy when, using an array, you want to transform into an object list.
const names = ["A", "B", "C"]
names.map((item, i) => ({"nombre": item, "pos": (i+1) }) );
arrow function
Other times, they are not needed
Generalmente, cuando estas trabajando con algún objeto, puede no ser necesario que se usen, siendo necesario utilizar function explícitamente. Es decir, si necesitas hacer uso de this, tendrás que explicitarlo.también, cuando necesitas vincular con un método del objeto, o bien necesitas incluir métodos a prototype.
También cuando una función se asocia con algún evento concreto y es necesario hacer uso del objeto que produce la llamada.
Por último, cuando necesitas algo del objeto argumento, no podrás utilizar las funciones flechas.
Tampoco podrás usarla si necesitas utilizar yield.
Valores por defecto en funciones
Otras de las novedades de las últimas versiones de Javascript es la posibilidad de incluir valores por defecto. Esto siempre ha estado en Python, pero ahora ya es una realidad de ES6, de forma que en caso de no recibir valor, se incluye uno por defecto. Los parámetros que incluyen valores por defecto irán al final de la función, y siempre se respeta el orden.
Esto del “orden” es importante, porque en Python, sí es posible asignar independiente del orden, pero no es el caso de Javascript, donde hay que respetar el orden de los parámetros.
Javascript, copiando de Python
Sin duda, los cambios en la sintaxis que están incluyendo en las versiones más actuales de Javascript hacen que muchas cosas se parezcan a Python, y así, las funciones anónimas eran una característica de Python desde sus primeras versiones. Por otro lado, intercambiar el valor de variables ahora es más sencillo en Javascript, sin utilizar variable intermedia: [uno, dos] = [dos, uno]
La asignación de valores con condicionales es otra característica que me gusta mucho, y reduce complejidad y favorece la lectura, si bien, esto no es nada nuevo.
Los decoradores es otra característica de Python que ya está disponible en Javascript, si bien, no es una de las características que domine, en ninguno de los dos lenguajes.
Happy coding!