practicas - tipos de parse en javascript

Declaración de espacio de nombres de Javascript con función-prototipo.

Question

Lo sé, esto se discute a menudo. Pero después de buscar como alguien del siglo XIX, necesito un consejo. No tengo ningún problema al declarar un "espacio de nombres", pero cuando se trata de una función prototype.foo, me quedé atascado. Encontré una manera, pero no me gusta:

Namespace = {}
Namespace.obj = function() {
    this.foo="bar";
}
Namespace.obj.prototype.start = function() {
    this.foo="fubar";
}

blah = new Namespace.obj();
blah.start();

Ahora, ya que soy un poco neurótico en caso de scripting, me gustaría tener algo como esto:

Namespace = {
    obj: function() {
        this.foo="bar";
    },
    obj.prototype.start: function(tabinst) {
        this.foo="fubar";
    }
}
...

Pero luego lanza un error: "Uncaught SyntaxError: Token inesperado".

Lo sé, esto es cosmético, pero creo que tiene que haber un mejor método para declarar un "espacio de nombres" que contenga una clase y funciones de prototipo.

Answer 1

La forma en que lo haría es usando el "Patrón del módulo" .
Básicamente, encapsula toda la lógica de su "Módulo" en una función de ejecución automática que devolvería un objeto con sus clases, funciones, variables, etc. Piense en el valor de retorno como una exposición de su API del Módulo.

Namespace = (function () {
    /** Class obj **/
    var obj = function () {
        this.foo = ''bar'';
    };
    obj.prototype = {
        start: function () {
            this.foo = ''fubar'';
        }
    };

    /** Class obj2 **/  
    var obj2 = function () {
        this.bar = ''foo''
    };
    obj2.prototype = {
        start: function () {
            this.bar = ''barfoo'';
        },
        end: function () {
            this.bar = '''';
        }
    };
    return {
        obj : obj,
        obj2: obj2
    };
})();

var o = new Namespace.obj()
o.start()

Para poder encapsular aún más los métodos de clase "obj" y el constructor, podemos hacer lo siguiente:

/** Class obj **/
var obj = (function () {
    /** class Constructor **/
    var obj = function () {
        this.foo = ''bar'';
    };
    /** class methods **/
    obj.prototype = {
        start: function () {
            this.foo = ''fubar'';
        }
    };
    return obj;
})();

También hay una característica importante que viene gratis al usar este patrón, que es "Variables privadas", considere lo siguiente:

/** Class Foo **/
var Foo = (function () {
    // Private variables
    var private_number = 200
    /** class Constructor **/
    var Foo = function () {
        this.bar = 0;
    };
    /** class methods **/
    Foo.prototype = {
        add: function () {
            this.bar += private_number;
        }
    };
    return Foo;
})();

foo = new Foo();
alert(foo.bar); // 0
foo.add(); 
alert(foo.bar);// 200
alert(foo.private_number) //undefined

Answer 2

Sí, porque no puede usar este tipo de encadenamiento en una declaración de objeto

obj.prototype u obj.something here, porque el lenguaje ve a obj como un valor no objeto. Puedes falsificar un efecto como este

Namespace = {};

Namespace.obj =function() {
        this.foo="bar";
};

Namespace.obj.prototype.start = function(tabinst) {
        this.foo="fubar";
};

console.log( Namespace.obj.prototype );

(vea este violín http://jsfiddle.net/WewnF/ )

EDIT: Wow, acabo de notar que lo que dije ya estaba dentro de la pregunta. Lo siento mucho, no noté que antes ... Bueno, la forma en que se describió a sí mismo es el método correcto para lograrlo.

De lo contrario, puede volver a escribir su código de esta manera, pero no es exactamente lo que está buscando y no funcionará de la misma manera (ya que obj no será una función en sí misma y tendrá que llamar a su función principal como esta). principal(); )

Namespace = {
    obj: {
          main : function() {
               this.foo="bar";
          },
          prototype : {
             start: function(tabinst) {
             this.foo="fubar";
             }
          }
    }
}

EDITAR 2: ver este violín http://jsfiddle.net/NmA3v/1/

Namespace = {
    obj: function() {
        this.foo="bar";
    },
    prototype: {
        obj : {
            start : function( hi ) {
                 alert( hi ); 
            }  
        }

    },

    initProto : function(){
        for( var key in Namespace )
        {
            if( key !== "prototype" )
            {
                for( var jey in Namespace.prototype[ key ] )
                    Namespace[ key ].prototype[ jey ] =  Namespace.prototype[ key ][ jey ];  
            }
        }
    }
}

Namespace.initProto();

console.log( Namespace.obj);

var test  = new Namespace.obj();

test.start( "Hello World" );

Esto tendrá el mismo efecto exacto. Explicación: estamos declarando nuestros objetos como funciones-propiedades normales, y luego usamos un objeto prototipo maestro que contiene objetos con los mismos nombres que arriba, por ejemplo, para cada Namespace.obj, también hay un Namespace.prototype.obj que contiene el Funciones que queremos añadir en la cadena del prototipo.

luego, con namespace.protoInit (), iteramos a través de todas las propiedades, y extraemos las funciones del Namespace.prototype [key] y las agregamos al Namespace [key] .prototype, ¡extendiendo el objeto prototipo con éxito! Un poco poco ortodoxo, pero funciona!

Answer 3

Solo para patadas y para ampliar la respuesta anterior. Un poco más de objetos orientados a la notación basada en el espacio de nombres anidado

var NS = {};

// Class List
NS.Classes = {
  Shape: (function(){
    // Private
    var whateveryouwishboss = false;

    // Public
    var Shape = function(x,y,w,h){
      this.x = x;
      this.y = y;
      this.w = w;
      this.h = h;
    };
    Shape.prototype = {
      draw: function(){
        //... Im on prototype Shape 
      }
    }
    return Shape;
  })(),
  Person: (function(){
    //....
  })()
}

/////// Let the games begin

var rect = new NS.Class.Shape(0,0,10,10);
rect.draw()