父构造函数在所有子构造函数完成之前调用覆盖函数

Question

ECMAScript 6(Harmony)引入classes了从另一个继承的能力.假设我有一个游戏和一些基本类来描述机器人行为的基本内容.我简化了我的真实架构,但假设我需要运行render另一个例程,我将这些调用放在基本Bot类中.

class Bot{
  constructor(){
    render();
  }
  render(){}
}

每个机器人然后覆盖它的render功能,并可以在构造函数中进行一些设置:

class DevilBot extends Bot{
  constructor(){
    super();
    this.color = 0xB4D333;
  }
  render(){
    createSomeMesh(this.color);
  }
}

这里的问题是在我打电话之前super()- this不存在.但是super(父构造函数)将调用render需要color在子构造函数中定义的变量的重写.我可以在父构造函数中假设子对象将实现一些init具有所有必需设置的函数并调用它:

class Bot{
  constructor(){
    if (this.init) this.init();
    render();
  }
  render(){}
}

class DevilBot extends Bot{
  init(){
    this.color = 0xB4D333;
  }
  render(){
    createSomeMesh(this.color);
  }
}

但这种方法有多好,什么是解决这种问题的首选方法？

Answer 1

以下代码将执行您想要的操作,但目前仅支持FF 41+和Chrome 47+(请参阅https://kangax.github.io/compat-table/es6/)

class Bot{
    constructor(){
        if (new.target === Bot)
            this.render();
    }
    render(){
        console.log('Bot rendered');
    }
}

class DevilBot extends Bot{
    constructor(){
        super();
        this.color = 0xB4D333;
        this.render();
    }
    render(){
        console.log('DevilBot rendered with', this.color);
    }
}

var bot = new Bot();       // Bot rendered
var dev = new DevilBot();  // DevilBot rendered with 11850547