Las funciones de flecha nos permiten escribir una sintaxis de función mucho más corta.

Sintaxis

let namefunc = (arg1, arg2, ..., argN) => expression;

Ejemplo con parámetros:

let myFunction = (a, b) => {
  return a * b;
}

NOTA: Si la función tiene solo una declaración y la declaración devuelve un valor, se pueden eliminar los corchetes y la palabra clave return quedando así:

let myFunction = (a, b) => a * b;

Para ejecutar las anteriores funciones, se llama a la función myFunction y se le pasan los parámetros (2,3) . si queremos mostrar que nos devuelve podemos hacerlo utilizando la consola, console.log:

console.log(myFunction(2,3)); // Devuelve 6

Ejemplo sin parámetros:

hello = () => {
  return "Hello World!";
}

NOTA: Si la función tiene solo una declaración y la declaración devuelve un valor, se pueden eliminar los corchetes y la palabra clave return quedando así:

hello = () => "Hello World!";

Para ejecutar la anterior función:

hello();

Si quisiéramos escribir las funciones tradicionales de los anteriores ejemplos, serían estas en ambos casos:

myFunction = function(a,b){
  return a * b;	
}

hello = function(){
  return "Hello World!";	
}

La forma de llamar a las funciones tradicionales es la misma que cuando llamamos a funciones flecha.

La utilización de las funciones flecha simplifica el código pero es limitada y no se puede utilizar en todas las situaciones.

• No tiene sus propios enlaces a this o super y no se debe usar como métodos.

• No tiene argumentos o palabras clave new.target.

• No apta para los métodos call, apply y bind, que generalmente se basan en establecer un ámbito o alcance.

• No se puede utilizar como constructor.

• No se puede utilizar yield dentro de su cuerpo.

• Las funciones de flecha son útiles para acciones simples, especialmente las de una sola línea.

• Las funciones de flecha vienen en dos variantes:

Sin llaves:

(...args) => expression –> el lado derecho es una expresión; la función la evalúa y devuelve el resultado. Pueden omitirse los paréntesis si solo hay un argumento, por ejemplo:

`n => n*2´.

Con llaves: (...args) => { body } –> las llaves nos permiten escribir varias declaraciones dentro de la función, pero necesitamos un return explícito para devolver algo.

📚REFERENCIAS:

https://www.w3schools.com/js/js_arrow_function.asp

https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Functions/Arrow_functions