Posts Tagged ‘poo’

Javascript : Orientado a objetos

A pesar de lo que podamos pensar por el nombre, poco se parece Javascript y Java en lo que a POO se refiere…

Intentare dejar por aquí unos Snippets que puedan ser útiles para iniciarse en OOP con Javascript.

Crear un objeto :

miobjeto = new Object();

o

miobjeto = {};

Declarar un array :

miarray = new Array();

o

miarray = [];

Agregar miembros al objeto creado anteriormente :

miobjeto.variable = “hola”;

miobjeto.metodo = new Function();

En JavaScript no es posible declarar Clases, pero si es posible instanciar objetos a partir de un constructor.

Usaremos el  objeto Function  como objeto instanciable en JavaScript, y el cuerpo de la función sera el constructor del objeto. Podremos llamar al constructor con el operador new.

Ejemplo :

/*clase de ejemplo*/

miClase = new Function();

nuevoObjeto = new miClase(); // instanciamos ‘miClase’

Para emular las clases en JavaScript usaremos la palabra clave this dentro de los constructores.

/*clase de ejemplo*/

miClase = function(){

/*

agregamos miembros dinamicamente

al objeto que será retornado

*/

this.propiedad = “hola!”;

this.metodo = function(){

/* aqui ‘this’ hace referencia al objeto al que pertenece el metodo */

alert(this.propiedad);

}

}

nuevoObjeto = new miClase(); // instanciamos ‘miClase’

Este link del cual me he inspirado toca en mas profundidad el tema, y puede seros de gran ayuda. Dejaremos para otro post la propiedad prototype

Share

Javascript : Class.js Script para facilitar el uso de Clases en javascript

Si vienes de otros lenguajes mas estándar en el uso de la POO, Javascript puede parecerte un tanto tosco en su manera de interpretarla.

Hemos encontrado un script que pesa menos de un kilobyte (se trata de Class.js) y que te facilitara la vida.

Así quedaría crearíamos una clase con Javascript :

One = {
	
	message:'',
	
	set:function(val){
	
		this.message = val;
	
	},
	
	get:function(){
	
		alert(this.message);
	
	}

};

Así la usaríamos :

var e = new Class(One);
e.set('Hello, World!');
e.get();

Para el tema constructores, si los necesitamos los definiremos como “construct()“, y serán llamados al instanciar la clase. Ese constructor podrá tener argumentos

One = {
	
	message:'',
	
	construct:function(val){
	
		this.set(val);
	
	},
	
	set:function(val){
	
		this.message = val;
	
	},
	
	get:function(){
	
		alert(this.message);
	
	}

};

Y lo usaríamos así :

var e = new Class(One,['Awesome!']);
e.get();

El script nos otorga también la posibilidad de “extender” clases, y lo definiríamos de esta manera :

One = {

	message:'',
	
	set:function(val){
	
		this.message = val;
	
	},
	
	get:function(){
	
		alert(this.message);
	
	}

};

Two = Extend(One,{

	construct:function(val){
	
		this.set(val);
	
	}

});

Y lo utilizaremos así :

var e = new Class(Two,['Quixotic!']);
e.get();

Aunque se nos notifica que no podemos sobrecargar métodos en las clases extendidas.

El script también permite extender instancias de clases, y el uso de plugins…pero para eso ya os dejo investigar un poco.

Os dejo de nuevo la URL que a bote pronto me parece muy interesante : URL Class.js

Share