Antes que nada!! Recordá siempre que en javascript todo menos los primitivos son objetos y las funciones no son la excepción.
Ahora bien, en javascript tenemos diferentes modos de crear una función. Veamos la primera que presentaremos
1 | function miFuncion() { |
De este modo creamos una función a la que llamamos miFuncion con la palabra reservada function. Dentro de los paréntesis podemos pasarle argumentos a la función, como por ejemplo
1 | function miFuncion(nombre) { |
Hemos llamados a esta función miFuncion y así se ha almacenado en memoria, de modo que podemos ejecutarla llamándola por su nombre. Ahora bien, también podríamos crear una función anónima y guardarla en una variable
1 | const miFuncion = function (nombre) { |
Así creamos una función anónima a la que no le asignamos ningún nombre y la guardamos en la constante llamada miFuncion.
Otro modo de crear funciones es con la expresión de flecha. Definamos una arrow function
1 | const miFuncion = (nombre) => { |
Para lxs mas curiosxs
La pregunta que probablemente sobrevenga es cuál es la diferencia entre una arrow function y una funcion creada a partir del operador function. Bien, para entender esta diferencia hay que hablar del contexto de una función. Este contexto no es más que el espacio de memoria donde se guardan las variables a las que la función accede. La diferencia entre las dos formas de crear funciones es que en el caso de la arrow function este contexto es definido en la declaración de la función, mientras que en la función creada a partir del operador function el contexto es definido al llamar la función.
Veamos un ejemplo
1 | function ejemploContextos() { |
Analicemos el resultado.
En las lineas 33 y 34 imprimimos los valores que nos retornan ambas funciones (function y arrow funtion) para comprobar que ambas acceden a os valores globales (tiéngulo y rojo)
Luego, en las lineas 35 y 36 imprimimos los valores de las propiedades asignadas a la figura creada y evaluamos un comportamiento diferente. Mientras que en el caso de la función creada con el operador function para obtener la figura nos devuelve el valor asignado en el contexto de la funcion a partir de la cual instanciamos la nueva figura; mientras que la funcion creada mediante arrow function para obtener el color nos sigue devolviendo el valor global y no el establecido en el contexto de la funcion de la cual instanciamos la nueva fugura.
Esto se debe, como mencionamos arriba es dónde se define el contexto, para la arrow function es definido en la declaración en la function es al momento de la llamada.
Este es un tema que tiene su complejidad y la asimilación del tema puede llevar tiempo. En la práctica lo importante es conocer que se diferencian en cómo se relacionan con el contexto :)