martes, 23 de julio de 2013

Entendiendo Javascript (III)


Objetos por aquí, objetos por allá, muy bonito, muy bonito, pero de que sirve esto sin la Herencia?

Herencia
Retomando, JavaScript nos provee ciertas herramientas para poder usar programación orientada a objetos, entre estas los prototipos, de esta manera podemos hacer gala de nuestras habilidades con este paradigma, pero aún hace falta una de las mas importantes herramientas, la herencia.
La herencia en JavaScript se hace al igual que las clases mediante el prototipo, pero hay dos maneras de implementarla:

Herencia Mediante Cadena de Prototipos:
Este tipo de herencia se hace mediante el uso del prototipo de los objetos, de esta manera:

// Ejemplo de Herencia por prototipos

// clase padre
function Mamifero(medio, num_extremidades, sonido){
    this.medio = medio; 
    this.extremidades = num_extremidades;
    this.saludo = function(){console.log(sonido)};
}

// clase hija
function Perro(raza){
    this.raza = raza;
}
// especificamos cual es la clase padre
Perro.prototype = new Mamifero("terrestre", 4, "Guauu, Guauu...");
fluffy = new Perro("Doberman");
fluffy.saludo()
// Fin del ejemplo

Lo que acabamos de ver se llama cadena de prototipos, y esta se basa en que una clase hija lo que hace es reemplazar su prototipo por una instancia de la clase padre, por esto se hace la asignación de una instancia de la clase padre al prototipo como vemos en la linea 15.

Herencia mediante llamado al Constructor del Padre:
Este tipo de herencia hace uso del constructor de la clase padre de manera directa, se hace así:
// Ejemplo de Herencia por prototipos

// clase padre
function Mamifero(medio, num_extremidades, sonido){
    this.medio = medio; 
    this.extremidades = num_extremidades;
    this.saludo = function(){console.log(sonido)};
}

// clase hija
function Gato(raza){
    Mamifero.call(this,"terrestre", 4, "Miauu, Miauu...");
    this.raza = raza;
}
// insatancia de la clase
jack = new Gato("Angora")
jack.saludo()
// Fin del ejemplo

Lo que acabamos de ver fue otra manera de usar herencia en JavaScript, esta es más interesante por que encapsula todo dentro del mismo bloque de código. Lo que se está haciendo es que se llama el constructor de la clase padre pero se especifica que los atributos y métodos de la clase padre deben ser establecidos en la clase actual, lo anterior se lleva a cabo mediante el método call, usado en la linea 12, el cual recibe como primer parámetro la referencia al objeto en construcción.

4 comentarios:

  1. Excelente, muy buena la explicación y el ejemplo.

    ResponderEliminar
  2. Por cierto, cuál de tantos IDEs que hay recomienda?

    ResponderEliminar
  3. mmm, en ese aspecto hay mucho de donde cortar, en este momento hay un proyecto muy interesante llamado Light Table, el cual tiene como punto fuerte la ejecución en tiempo real del código, es decir, a medida que se codifica se pueden ver lo que hace el procedimiento, aun esta en una fase alfa pero es muy interesante. Entre tanto para JavaScript cualquier editor liviano esta muy bien por que para mi en este caso lo que importa es la agilidad a la hora de codificar.

    ResponderEliminar
  4. Muchas gracias.
    Porque ya lo tengo instalado voy a utilizar Eclipe, luego miro si hay otra opción mejor.

    ResponderEliminar