typescript parent class 正在调用派生函数

typescript parent class is calling derived function

我有一个基础class和一个派生的,每个都有初始化函数。

当我构建派生的时,我希望它:

  1. 调用其基础构造函数:

    1.1。调用它的初始化函数

  2. 调用它自己的(派生的)初始化函数。

问题是派生的init函数被调用了两次。

代码:

class Base{
    constructor() {
        this.init();
    }
    init(){
        console.log("Base init");
    }
}
class Derived extends Base{
    constructor() {
        super();
        this.init();
    }
    init(){
        console.log("Derived init");
    }
}
var obj = new Derived ();

输出:

Derived init
Derived init

以防万一,我们想调用base init()然后调用child init()我们可以这样解决:

constructor() {
    super.init();
    super();        
}

勾选example here

先子后基的解决方案应该是这样的。

constructor() {
    super();
    //this.init();
    super.init();
}

this playground 中有一个工作示例。点击运行看到生成的两个按钮

如果我们只想使用派生的东西,我们不必再次调用 init

constructor() {
    super();
    //this.init();
    // init will be called in super
}

这个例子只使用了child stuff

另一种方法可能是这样(也使用 Radim 的游乐场示例):

   class Base{
    constructor() {
        this.init();
    }
    init(){
        var button = document.createElement('button');      
        button.textContent = "base init";
        document.body.appendChild(button);
    }
}
class Derived extends Base{
    constructor() {
        super();

    }
    init(){
        super.init();
        var button = document.createElement('button');      
        button.textContent = "Derived init";
        document.body.appendChild(button);
    }
}
var obj = new Derived ();

通过从派生的 class 调用祖先的 init 函数,您可以获得想要的流程。

考虑祖先的 init 是一个在派生的 class(-es) 中被覆盖的虚方法。

Playground Example