父构造函数在所有子构造函数完成之前调用覆盖函数 [英] Parent constructor call overriden functions before all child constructors are finished

问题描述

ECMAScript 6（Harmony）引入了类，能够从另一个继承。假设我有一个游戏和一些基本类来描述机器人行为的基本事情。我简化了我的真实架构，但是假设我需要运行 render 和另一个例程，我把这个调用放在基本的 Bot 类。

  class Bot {
 constructor（）{
 render（）; 
} 
 render（）{} 
} 
  

然后覆盖它的 render 函数，并且可以在构造函数中有一些设置：

  DevilBot类扩展了Bot {
 constructor（）{
 super（）; 
 this.color = 0xB4D333; 
} 
 render（）{
 createSomeMesh（this.color）; 
} 
} 
  

这里的问题是在我调用 super（） - 这个不存在。但是， super （父构造函数）将调用需要颜色的被覆盖的 render code>在子构造函数中定义的变量。我可以在父构造函数中假设子对象将使用所有需要的设置实现一些 init 函数，并调用它：

  class Bot {
 constructor（）{
 if（this.init）this.init（）; 
 render（）; 
} 
 render（）{} 
} 
 
 class DevilBot extends Bot {
 init（）{
 this.color = 0xB4D333; 
} 
 render（）{
 createSomeMesh（this.color）; 
} 
} 
  

但这种方法和什么是首选方式有多好解决这个问题？也许我在做错事，甚至不会面对这个问题？

解决方案

以下代码将会做你所做的想要，虽然目前只支援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 render with'，this.color）; 
} 
} 
 
 var bot = new Bot（）; // Bot呈现
 var dev = new DevilBot（）; // DevilBot渲染与11850547 
  




ECMAScript 6 (Harmony) introduces classes with ability to inherit one from another. Suppose I have a game and some basic class to describe basic things for bot behavior. I simplify my real architecture but suppose I need to run render and some another routine and I put this calls in basic Bot class.

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

Each bot then override it's render function and can have some settings in constructor:

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

The problem here is that before I call super() - this does not exist. But super (parent constructor) will call the overridden render that would need the color variable defined in the child constructor. I can suppose in the parent constructor that the child object would implement some init function with all needed settings and call it:

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

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

But how good this approach and what is a preferred way to solve such a problem? Maybe I'm doing something wrong and I will not even have to face this problem?

解决方案

The following code will do what you want, though it is currently only supported in FF 41+ and Chrome 47+ (see 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

这篇关于父构造函数在所有子构造函数完成之前调用覆盖函数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！