Funciones declarativas vs Funciones de expresiones en JavaScript

- Andrés Cruz

In english
Funciones declarativas vs Funciones de expresiones en JavaScript

Normalmente cuando desarrollamos nuestros scripts JavaScript empleamos funciones para todo y de esta forma modularizar los más posible nuestros programas; aunque la API JavaScript cuenta con otro componente muy parecido a las funciones típicas que conocemos en JavaScript llamadas funciones declarativas, este otro componente se conoce como funciones de expresión en JavaScript.

Las funciones de expresiones en JavaScript

Seguramente lo habrás notado en otros Blogs o foros de ayuda al buscar cualquier tutorial o ayuda de como usar algún componente de JavaScript la siguiente forma de declarar una función:

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

Y esta otra la cual es la más conocida y usada (en parte debe ser debido a que es la sintaxis básica usada en cualquier lenguaje de programación) llamadas funciones declarativas:

function sumar (a,b) {return a+b;}

Ambas declaraciones de funciones que obviamente sintácticamente no son iguales hace que el compilador de JavaScript lo trate de manera distinta; hagamos unas pruebas más sus resultados:

console.log(suma(2,3));
var sumar = function (a,b) {return a+b;}

Da como resultado:

TypeError: undefined is not a function

Y esta otra más conocida:

console.log(suma(2,3));
function sumar(a,b) {return a+b;}

Da como resultado:

5

¿Cual es la diferencia entre las dos secciones de código anteriores?

Ambas formas que vimos anteriormente son declaraciones válidas de una función en JavaScript pero con un formato diferente y por ende con un comportamiento diferente:

Funciones Declarativas vs Funciones de Expresiones en javaScript

Entonces podemos referencia una función mediante una variable o empleando directamente el nombre de la función; lo interesante no es su sintaxis que difiere de una a otra si no cómo lo interpreta el compilador de JavaScript lo cual intentaré explicar mediante la siguiente sección de código:

console.log(suma(2,3));
function sumar(a,b) {return a+b;}

La pasada expresión de la función llamada "suma" el compilador de JavaScript lo convierte en:

function sumar(a,b) {return a+b;}
console.log(suma(2,3));

Es decir; el compilador coloca las definiciones de las funciones y ubica la función al principio del código; en otras palabras, el compilador de JavaScript convierte la declaración vista anteriormente en un ámbito global a todo el programa al contrario que solo corresponde a una sección definida del programa.

Andrés Cruz

Desarrollo con Laravel, Django, Flask, CodeIgniter, HTML5, CSS3, MySQL, JavaScript, Vue, Android, iOS, Flutter

Andrés Cruz en Udemy

Acepto recibir anuncios de interes sobre este Blog.