12

En la red me encontré el siguiente código de multiplicación:

$(document).ready(function() {
  let multiply = (a, b) => {
    return a * b
  }
  $('#salida').text(multiply(2, 8));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p id="salida"></p>

( Código totalmente funcional en Firefox 44.0.2 )

Entiendo que no es una función como normalmente se maneja en javascript.

¿Alguien me podría explicar qué es el => que aparece en el código y sus usos?

Carlos Muñoz
  • 12,864
  • 2
  • 42
  • 62
Ruslan López
  • 10,060
  • 11
  • 35
  • 68

1 Answers1

19

Ese es el llamado arrow function o función flecha y en ECMAScript 2015 sirve como nueva sintaxis para especificar un nuevo tipo de funciones muy parecidas a las tradicionales excepto en algunas diferencias.

Ejemplo:

var sumaTradicional = function(a, b){
    return a + b;
}

Es equivalente (no igual) a:

var sumaConFlecha = (a,b) => a + b;

Es una forma sintácticamente más corta de especificar algunas funciones.

En este caso el operador => está precedido por la lista de argumentos de la función y va seguido por la expresión que se devuelve como resultado de la ejecución de la función.

En caso que se requiere varias líneas como cuerpo de la función se puede definir de la forma tradicional utilizando { return expresion; }

Ejemplo:

var sumaConFlecha = (a,b) => { return a + b; };

o

var sumaConFlecha = (a,b) => {
    // Mas líneas de código
    return a + b;
};

Si se requiere una función que no devuelva valores también se puede especificar de la siguiente manera:

var loguearSumaConFlecha = (a,b) => {
    console.log(a + b);
};

Sin embargo se deben tener en cuenta las diferencias y cuando usar la forma tradicional o la forma de función flecha.

En esta pregunta: ¿Cuando usar una función flecha en vez de una función común? se explican las diferencias.

Especifición completa: Arrow Function Definitions

Carlos Muñoz
  • 12,864
  • 2
  • 42
  • 62