Una de las cosas complicadas al empezar con Javascript es entender como funcionan los Closures, o al menos saber identificarlos, porque como ya habrán escuchado en videos o tutoriales, los usamos varias veces sin darnos cuenta.
Pero antes de adentrarnos en el código vamos a hablar de algunos temas importantes:
Contexto de ejecución
En resumidas cuentas, es un lugar en donde se guardan 3 cosas importantes:
- El valor de this
- Lexical Environment
- Variable Environment
Pero estas dos últimas cosas son practicamente lo mismo, así que vamos a unirlos y llamarlo Lexical Environment.
En Lexical Enviroenment almacenamos nuestras variables con sus nombres y sus respectivos valores, el mismo caso es para las funciones, así que si tenemos el siguiente código:
function nombre() {
let a = 10;
function imprimir() {
console.log(a)
}
}
foo()
Nuestro contexto de ejecución se vería algo así:
execution_environment: {
LexicalEnvironment: {
a: 10,
imprimir: function() {}
},
ValorDeThis: ...
}
Lexical Scope
El lexical scope significa que en un grupo anidado de funciones, las funciones internas tienen acceso a las variables y otros recursos de su ámbito padre. Esto significa que las funciones hijas están vinculadas léxicamente al contexto de ejecución de sus padres.
REF: Link
Sabiendo todo esto, podemos decir que un closure es la posibilidad que tiene una o varias funciones anidadas de acceder al Lexical Environment de una función padre, y esto es posible gracias al Lexical Scope, que nos da la posibildiad de que esta o estas funciones estén vinculadas al contexto de ejecución de su función padre.
Pero eso no es todo, para que una función sea considerada como closure tampoco tiene que tener variables declaradas dentro de ellas.
Y acá el ejemplo en código de un clousure:
function imprimir (){
let saludo = 'Hola';
return function comoEstas(nombre){
console.log(`${saludo} ${nombre} como estás?`);
}
}
imprimir()('nahuel');
La salida sería:
Hola nahuel como estás?
Top comments (0)