Javascript Orientado a Objetos

Javascript es un lenguaje muy poderoso que puede ser programado orientado a objetos pero tiene una particularidad que en vez de estar basado en clases esta basado en prototipos en donde todos los objetos creados son instancias.

El aprender a programar javascript OOP nos servirá mucho en el entendimiento de los diferentes frameworks en javascript que circundan por la red como mootools, prototypejs, jquery entre otros.

Otra de las ventajas de aprender OOP en Javascript es que hará que nuestra calidad de código sea cada vez mejor a la par que nuestra cantidad de código sea menor.

Creación del Objeto Constructor

Una de las características principales de la OOP es la creación del constructor el método que se ejecuta al instanciar al objeto, podemos crear el constructor de 2 formas la primera con la creación de una función común y corriente, la segunda creando una variable que contenga a la función

//Primera Forma
function empleado(){
}
//Segunda Forma
var empleado=function(){
}

Instanciando el Objeto

Una vez creado el objeto y el método constructor crearemos su instancia respectiva

//Metodo Constructor del Objeto
function empleado(){
}
//Instanciando al Objeto
nemp = new empleado();

Creando Propiedades

Podemos crear diversas propiedades del método y del objeto a través de la palabra reservada “this”

//Constructor
function empleado(nombre,apellidos, edad){
//Propiedades
this.nombre = nombre;
this.apellidos = apellidos;
this.edad = edad;
this.fingreso = Date();
alert("Hola " + this.apellidos + ", " + this.nombre +
" Ingresaste el " + this.fingreso);
}
var nemp = new empleado("Erick","Mendoza Rivera",22);

Añadiendo Métodos

Podemos añadir diversos métodos al objeto de 2 formas la primera creando una propiedad que llame a una función externa la segunda utilizando prototype.

Todo objeto creado en Javascript hereda una propiedad llamada prototype(prototipo) con ella podemos añadir métodos y propiedades al objeto creado. Al instanciar un objeto y llamar a una propiedad o método javascript busca directamente en el objeto si no existe buscara en los prototipos creados en el hasta alcanzar el prototipo raíz.

//PRIMERA FORMA
function empleado(nombre,apellidos,edad){
this.nombre = nombre;
this.apellidos = apellidos;
this.edad =  edad;
this.fingreso = Date();
//Llamando a la función externa "grabar"
this.metodo1 = grabar(this.fingreso);
}
function grabar(fecha){
alert("Grabado el " + fecha);
}
var emp = new empleado();
emp.metodo1;

//SEGUNDA FORMA -> modo1
function empleado(nombre,apellidos,edad){
this.nombre = nombre;
this.apellidos = apellidos;
this.edad =  edad;
this.fingreso = Date();
}
//Creando método con la propiedad prototype
empleado.prototype.metodo1 = function(){
alert("Llamando al Metodo 1");
}
empleado.prototype.metodo2 = function(){
alert("Llamando al Metodo 2");
}
var nemp = new empleado("Erick","Mendoza Rivera",22);
nemp.metodo1();
nemp.metodo2();

//SEGUNDA FORMA -> modo2
function empleado(nombre,apellidos,edad){
this.nombre = nombre;
this.apellidos = apellidos;
this.edad =  edad;
this.fingreso = Date();
}
//Usando una variable auxiliar
var e;
//Vinculando el prototipo del objeto con la variable
e = empleado.prototype;
e.metodo1 = function(){
alert("Llamando al Método 1");
}
e.metodo2 = function(){
alert("Llamando al Método 2");
}
//En lo persona prefiero la segunda forma ademas que
//ahorro código y de estar digitando “prototype” a cada rato

var nemp = new empleado();
nemp.metodo1();
nemp.metodo2();

Herencia

Una característica de la programación orientada a objetos es el de poder heredar métodos y propiedades de otra clase, en javascript podemos generar herencia de otros objetos a través de propiedad prototype.

//Objeto Secundario
function persona(){
this.sexo = "Masculino";
this.profesion = "Desarrollador";
this.anyo = 2007;
}
var p = persona.prototype;
p.mostrarAnyo = function(){
alert(this.anyo);
}

//Objeto Principal
function empleado(nombre,apellidos,edad){
this.nombre = nombre;
this.apellidos = apellidos;
this.edad =  edad;
this.fingreso = Date();
}

//El objeto "empleado hereda los métodos
//y propiedades del objeto "persona"
//la herencia se debe realizar después de creado el constructor
//y antes de volver a utilizar "prototype" para crear los métodos
empleado.prototype = new persona();

var e = empleado.prototype
e.mostrarFecha = function(){
alert(this.fingreso);
}

//Instanciando
var nemp = new empleado("Erick","Mendoza Rivera",22);
alert(nemp.nombre); //Propiedad Nativa
alert(nemp.sexo);  //Propiedad Heredada
nemp.mostrarFecha(); //Método Nativo
nemp.mostrarAnyo(); //Método Heredado

Polimorfismo

Otra de las características del OOP es el polimorfismo, los métodos y propiedades de 2 objetos diferentes pueden tener el mismo nombre pero comportarse de diferente manera según el objeto que se este usando.

//PRIMER OBJETO
function objeto1(){
}
//SEGUNDO OBJETO
function objeto2(){
}
objeto1.prototype.grabar = function(){
alert("Primer Método Grabar");
}
objeto2.prototype.grabar = function(){
alert("Segundo Método Grabar");
}
var obj1=new objeto1();
var obj2=new objeto2();
//Iguales nombres de los métodos nos muestran
//resultados diferentes
obj1.grabar();
obj2.grabar();

Miembros Privados

El principio de ocultación de la OOP podemos realizarlo fácilmente en métodos y propiedades del objeto, el primero creando los métodos en el mismo constructor y el segundo dejando de utilizar la palabra reservada “this” creando variables del propio objeto.

//Constructor
function producto(){
 //propiedad publica
this.marca = "IBM";
//anyo por su parte es una propiedad del objeto privada
// pues solo se puede acceder en el objeto en si
var anyo = 2007;
// Método Publico
this.registrar = function(){
alert("Método Registrar");
}
//Método Privado
function eliminar(){
alert("Método Eliminar");
}
}
var pro = new producto();
alert(pro.marca); //IBM
alert(pro.anyo); //Undefined
pro.registrar(); // Método Registrar
pro.eliminar(); //Error : El Método no Existe

Extensiones de Objetos

Como ya dijimos prototype esta inmerso en todo objeto que se cree por tanto podemos usarlo en objetos del propio javascript para añadir nuevos métodos y propiedades que nos sean útiles.

Ejemplo : El Objeto Date tiene un grupo de métodos que nos devuelve el mes, año, mes, etc podemos usar prototype para que nos desvuelva la fecha actual para eso vamos a añadir al objeto un método llamado fechaActual

//Vinculando el objeto a la variable
var d = Date.prototype;
//Añadiendo el Método
d.fechaActual = function(){
var ames = Array("Enero","Febrero","Marzo","Abril",
"Mayo","Junio","Julio","Agosto",
"Setiembre","Octubre","Noviembre","Diciembre");
var adia = Array("Domingo","Lunes","Martes","Miercoles",
"Jueves","Viernes","Sabado");
var nmes = ames[this.getMonth()];
var ndia = adia[this.getDay()] + " " + this.getDate();
var nyear = this.getFullYear();
var fecha = ndia + " de " + nmes + " de " + nyear;
alert(fecha);
}

//Creando una nueva Fecha
var fecha = new Date();
//Llamando a nuestro método
fecha.fechaActual();