Construcción de objetos en javascript


Construcción de objetos

Podemos construir un objeto con

var myPoint{ x:0; y:0};

Pero, por supuesto, esto sólo nos daría un copia del objeto. ¿Cómo creamos más de una instancia?, pues usando un object factory:

Point=function() {
return {x:0; y:0};
};
var myPoint= Point();

Sin embargo, así como el objeto va creciendo y se va sofisticando, es complicado de mantener; Una mejor alternativa es usar:

Point=function() {
var obj={};
obj.x=x;
obj.y=y;
return obj;
};
var myPoint= Point(1,2);

Acceso a los miembros de un objeto

Recordamos cómo dar acceso público o privado a los miembros de un objeto, aunque sabemos que en javascript no existen métodos, sólo referencias a objetos (tales como el objeto Function).

Point=function(x,y) {
var obj={};

// variables públicas
obj.x=x;
obj.y=y;

// variable privada
var privada = 10;

// este "método" es privado
function resta() {
return obj.x-obj.y;
};

// este "método" es público
obj.add=function() {
return obj.x+obj.y;
};

return obj;
};
var myPoint=Point(1,2);
console.log(myPoint.add()); // 3
myPoint.x=4;
console.log(myPoint.add()); // 6
  • add es público por que se devuelve con el objeto.
  • obj no existe fuera de myPoint.
  • obj es una variable privada para la instancia de objeto que hemos creado.
  • cualquier variable local declarada dentro del factory es tratada como privada.

Métodos de construcción

Diferencias entre new y var

Los dos métodos de construcción existentes son igualmente correctos: Usando la palabra clave new o creando un object-factory, pero posteriormente haremos una precisión respecto al uso de new y this.

new

Point=function(x,y) {
this.x=x;
this.y=y;
this.add=function() {
return this.x+this.y;
};
// no es necesario devolver this.
};
var myPoint=new Point(1,2);
console.log(myPoint.add()); // 3
myPoint.x=4;
console.log(myPoint.add()); // 6

var

Point=function(x,y) {
var obj={};
obj.x=x;
obj.y=y;
obj.add=function() {
return obj.x+obj.y;
};
return obj;
};
var myPoint=Point(1,2);
console.log(myPoint.add()); // 3

¿Cuál es la diferencia entre los dos?. La diferencia fundamental es que la versión con new devuelve el objeto this automáticamente.

Atención

Cuando nos referimos a this, estamos hablando del contexto de ejecución actual (la closure actual) dentro de una función.

this fuera de una función se refiere al objeto global this.
this dentro de una función se refiere al contexto de ejecución (la closure) actual.

Cuidado con las confusiones.

this como objeto global fuera de una función no es lo mismo que el contexto raiz.

x=3;
this.x=5;
console.log('x es',x,'y this.x es', this.x);
// x es 3 y this.x es 5

Es como si al principio del programa tuviéramos el objeto llamado this instanciado de la siguiente manera:

var this={};

y cada vez que creamos un objeto con new se nos añadiera dicha línea al principio del objeto de forma automática.

Mejor estilo

Según el artículo de Ian, la versión con new suena mejor al programador que viene de otros lenguajes, pero la versión con variable es más javascript.

Disclaimer

Esta entrada es resultado de apuntes tomados al vuelo leyendo la serie de artículos de javascript escrita por Ian Elliot en i-programmer. No pretende ser una traducción al español ni nada parecido, es un simple registro para mi uso personal. Debe referirse al original para su lectura.

Fuente: i-programmer.info
Written with StackEdit.