Desde siempre, en JavaScript las funciones han tenido una importancia primordial. Por un lado son el mecanismo para tener visibilidades y ámbitos, y además son "ciudadanos de primer orden". Eso significa que en JavaScript se puede, y de hecho se hace constantemente, pasar funciones como parámetros y devolver funciones como resultado.
En JavaScript podemos declarar una función anónima y colocarla en cualquier punto donde se espere un valor:
var value = function() { return 42};
value(); // 42
La variable value contiene un valor que es... una función. Es por ello que podemos usar el operador () sobre la variable y que su tipo, si lo consultamos con typeof, es function.
Observa que, una cosa es la variable value, y otra es el valor que hemos asignado a dicha variable: una función anónima. Dado que la función es anónima no hay manera de llamarla si no es a través de alguna variable que la contenga (como value).
Por supuesto también se pueden declarar en JavaScript funciones tradicionales, es decir con nombre, sin necesidad alguna de almacenarlas en una variable:
function value() { return 42;}
Al igual que antes, si ahora usas typeof para consultar el tipo de value obtendrás function, y al igual que antes puedes usar value(); para invocar a la función. Parece pues, que no hay ninguna diferencia, pero son dos cosas distintas: en el primer caso tienes una variable value cuyo valor es una función y en el segundo, value es directamente la función.
Puedes conocer las diferencias entre ambas formas de declarar las funciones en JavaScript en este artículo de nuestro tutor José Manuel Alarcón.
No deja de ser curioso que siendo JavaScript un lenguaje muy orientado a usar funciones anónimas, la sintaxis para declararlas sea un tanto "verbose", o por decirlo con palabras castellanas: tediosa, larga. Observa la sintaxis mínima necesaria para crear una función anónima que devuelva un valor:
function() {
return 10
}
Visto así no parece tan tediosa esta sintaxis. El problema es que se usa constantemente y al final la legibilidad se ve afectada. Para solucionar esta situación en ECMAScript 2015 (también conocida como ECMAScript 6 o ES6) se introdujo el operador de "flecha" (arrow o fat arrow) que ofrece una sintaxis alternativa, mucho más clara y sencilla para declarar funciones.
En el siguiente vídeo vamos a ver su sintaxis básica y cómo utilizarlo.
Fecha de publicación: