Использование массива для применения нескольких миксинов

Question

Используя ES6, есть ли способ применить несколько миксинов, которые определены в массиве? Миксины будут определены так:

const mixins = Array('Mixin', 'Mixin2');

Затем создаем миксин с:

export const Mixin = function (superClass) {
return class extends superClass {}

И используя миксин с:

export class MyClass extends MultipleMixins(BaseClass)

Answer 1

Вы можете использовать reduce() над массивом миксинов, передавать базовый класс и продолжать возвращать новый смешанный класс. Это будет только применить все смешивание в порядке:

class BaseClass {
  constructor(name) {
    this.name = name
  }
}

// adds an uppercase
const Mixin = function(superClass) {
  return class extends superClass {
    get uppercase() {
      this.name = this.name.toUpperCase()
      return this
    }
  }
}

//adds a reverse
const Mixin2 = function(superClass) {
  return class extends superClass {
    get reverse() {
      this.name = [...this.name].reverse().join('')
      return this
    }
  }
}

let mixins = [Mixin, Mixin2]

let MixedClass = mixins.reduce((base, mix) => mix(base), BaseClass)

let instance = new MixedClass('mark')
// use the new methods
console.log("reversed & uppercase:", instance.uppercase.reverse.name)