MENU


Mixins

Multiple Inheritance (Mixins)

A class has one parent, but extends accepts any expression. A mixin is a function that takes a base class and returns a subclass, so several behaviors stack into one chain where super and instanceof still work. Copying methods with Object.assign(Target.prototype, methods) is simpler, but copied methods cannot use super to reach the target's parent.

Mixins as class-returning functionsJavaScriptLive
const Jumper = (Base) => class Jumper extends Base { jump() { return `${this.name} jumped.`; } };
const Loud = (Base) => class Loud extends Base {
  speak() { return `${super.speak().toUpperCase()}!`; }        // super works inside mixins
};
class Animal { constructor(name) { this.name = name; } speak() { return 'woof'; } }
class Dalmatian extends Loud(Jumper(Animal)) {}                // Dalmatian > Loud > Jumper > Animal
const spotty = new Dalmatian('Spotty');
console.log(spotty.jump(), spotty.speak(), spotty instanceof Animal);