Execution Context y las variables dentro de Revealing Module Pattern

Cuando leí por primera vez sobre el module pattern, no lo entendí por completo. Me habría ahorrado muchos dolores de cabeza, si hubiera entendido primero qué es un execution context, bueno, este post se trata sobre eso!

Si aún no sabes qué es el module pattern, te recomiendo que leas este post de todd motto

Execution Context

Cuando se ejecuta código de javascript, ocurre magia. Parte de esa magia, envuelve a los execution context.

Un execution context es un objeto al que no puedes acceder explícitamente, y está compuesto por tres objetos:

  • Variable Object: El objeto al que pertenece el execution context. Contiene todas las variables definidas (directamente) dentro de ese execution context, incluyendo las funciones (no olvides que las funciones no son más que variables en javascript).
  • Scope Chain: Una cadena de Variable Objects, sirve para acceder (ordenadamente) a las variables dentro del contexto de ejecución.
  • this: Cuando encuentres la palabra clave this, en realidad, te estás refiriendo al valor guardado aquí.

Cada función tiene un execution context, y cuando la ejecución de código “fluye” dentro de una función, se dice que estás dentro del execution context de esa función.

Además de esto, todo lo que sucede fuera de una función, tiene su propio execution context; el variable object de este execution context es el global object.

¿Qué pasa con las variables en revealing module pattern?

Primero, creemos un objeto mediante revealing module pattern.

Creando un Objeto

El código que escribamos en el “punto a”, tendrá acceso a las siguientes variables:

Pero, si escribimos código fuera de la función instantánea anónima, la variable nombre, ya no será accesible.

Execution Context en este trozo de código

Como dije antes, cada función tiene un execution context. Pero algo raro pasa! además del execution context global y el execution context de la función inmediata, se ha creado un execution context de dog.

execution-context

Entonces, la función setName tiene acceso a la variable nombre, pero además, la variable setName es accesible desde la variable dog.

Es más, no importa la forma en la que intentemos hackearlo, la variable nombre, no puede ser directamente accedida fuera de la función instantánea anónima.

Esto es porque el execution context de la función instantánea anónima es totalmente distinto del execution context de la variable dog.

orly? o_O

yarly!

Consideremos este otro ejemplo:

el “this”, varía dependiendo de quién lo invoque, si recuerdan, en la sección en la que explico qué es un execution context, explico que cada execution context tiene qué valor guarda “this”.

Así que el comportamiento de este ejemplo, es posible, gracias a que la variable dog tiene su propio execution context y la función anónima instantánea también tiene su propio execution context.

Es por eso que, cuando invocamos showX dentro de la función instantánea anónima, “this” se refiere a esa función instantánea anónima.

Pero cuando invocamos showX fuera de la función instantánea anónima, y mediante la variable a, “this” se refiere al execution context de la variable a.

QED?

Tal vez te interese leer sobre los closures, “eso” que pasa cuando una función creada dentro de otra función puede ser accesible fuera de la función dentro de la cuál fue declarada, pero además, esa función interna, puede acceder a algunas de las variables declaradas dentro de la función que la contiene

Advertisements