> Faqs > Extender de dos clases a la vez en Javascript

Extender de dos clases a la vez en Javascript

Publico esta pregunta que me han hecho hoy y me parece un tema interesante. Se trata de extender de dos clases a la vez en el lenguaje Javascript.

La pregunta dice así:

Tengo un problema en Javascript que no se resolver, a ver si puedes ayudarme. Tengo que crearme una clase en la que quiero heredar de otra para extender una funcionalidad y ademas ayudarme de unos métodos que tengo definidos en otra clase independiente, ¿hay forma de extender de dos clases base? El problema es que estas dos clases bases forman de unos catálogos que no puedo tocar. Gracias.

Respuestas

Javascript no tiene herencia múltiple, pero existen mecanismos mediante los cuales puedes llegar al mismo resultado.

La manera más normal de resolverlo sería crearte un mixin. Un mixin en Javascript es una función que recibe una clase base y devuelve una clase base a la que se han añadido nuevos métodos.

Puedes ver más información sobre este punto en los mixins en Javascript.

Herencia múltiple en Javascript mediante el prototype

Pero como tú mismo dices, no siempre es posible aplicar un mixin, sobre todo cuando no lo tienes y lo que tienes son dos clases de las que tienes que extender, que forman parte de una librería. Volvemos al mismo punto, como no existe herencia múltiple, en principio no sería posible este comportamiento, pero aquí el lenguaje Javascript viene al rescate con los prototipos.

Mediante el prototipo es posible extender el comportamiento de una clase, creando nuevos métodos, que podrían perfectamente estar en otra clase.

Te voy a pasar un código de ejemplo en el que tenemos justamente una situación como la que comentas, tienes que extender de una clase y utilizar una propiedad y algún método extra que vienen de una segunda clase. La primera la podremos extender, para traerse los métodos de la segunda clase usaremos el prototipo.

// una clase base
class c1 {
  constructor() {
    this.name = "Soy c2";
  }

  saludar() {
    console.log("hola, " + this.name);
  }
}

// segunda clase base, un par de métodos
class c2 {
  constructor() {
    this.prop = 1;
  }
  foo() {
    this.prop++;
    console.log(this.prop);
  }
}

// nuestra clase, extiende directamente una de las dos clases
class c3 extends c1 {

}

// ahora podemos crear un objeto de la clase c3
let objeto = new c3();
objeto.saludar();

// a continuación exendemos mediante el uso del prototipo de la clase c3
//creamos una propiedad en el prototipo
c3.prototype.prop = 33;
// creamos un método, tomando como base el código de la clase c2
c3.prototype.foo = c2.prototype.foo

// ahora puedo ejecutar el método que hemos extendido mediante la clase c2
objeto.foo();
objeto.foo();
objeto.foo();
objeto.foo();
Miguel Angel
3310 147 216 17