June 26th, 2007

Module Pattern y Closures, algunos cuidados

Hace unos días Eric Miraglia escribió un articulo acerca de un patrón, llamado JavaScript Module Pattern, propuesto y utilizado por Douglas Crockford que permite ordenar un poco el código Javascript, de modo de no generar conflictos de nombres globales entre otras cosas.

Personalmente vengo usando un patrón similar desde hace un tiempo, siendo muy util ya que permite generar variables y métodos realmente privados. Sin embargo me he encontrado recurrentemente, al desarrollar aplicaciones grandes donde uso herencia, con que se debe tener cuidado al acceder desde una clase extendida a las propiedades de las clases base.

Supongamos el siguiente ejemplo:

Superclase = function () {
    var varA;

    return  {

            getVarA: function () {
              return varA;
            },
            setVarA: function (value) {
              varA = value;
            }
    };
  }();

  Subclase = function () {
    var varB;

    return  {

            getVarB: function () {
              return varB;
            },
            setVarB: function (value) {
              varB = value;
            }
    };
  }();

En Java, y otros lenguajes, es posible desde la Subclase hacer algo como varA = "valor", sin embargo si intentamos lo mismo usando este patrón no va a funcionar, o mejor dicho, no va a modificar la variable que queremos. La razón de esto es que al intentar modificar la variable varA desde la Subclase, javascript va a buscar una varA, dentro de su contexto de ejecución, al no encontrarla sigue el scope chain, pero en este caso ahi terminaría la busqueda, ya que el prototype de Subclase no está definido, y aunque explicitamente asignara Superclase como prototype de Subclase varA no aparecería. Por lo tanto no encuentra ninguna varA, y crea una nueva dentro de Subclase, en lugar de utilizar la varA de Superclase.

La solución a esto es usar el setter correspondiente en este caso setVarA(value), ya que en ese caso setVarA se ejecutaría en el contexto en que está definida varA, y ningún problema.

Es un tema bastante interesante, y complejo, el de los contextos de ejecución y clausuras. Para el que le interese puede entretenerse con el Standard ECMA-262 donde se explica muy bien el tema. Otra referencia interesante es Javascript Closures de Richard Cornford.