5

我对所有扩展抽象类的子类使用依赖注入。

问题是在抽象构造函数类中，我启动了一个我计划在其子项中覆盖的方法，如果需要的话。

我遇到了一个问题，即我注入的依赖项在从 super 启动的覆盖类中不可见。

这是一个代码示例：

abstract class Base {

    constructor(view: string) {
        this._assemble();
    }

    protected _assemble(): void {
        console.log("abstract assembling for all base classes");
    }

}

class Example extends Base {

    constructor(view: string, private helper: Function) {
        super(view);
        console.log(this.helper);
    }

    public tryMe(): void {
        this._assemble();
    }

    protected _assemble(): void {
        super._assemble();
        // at first run this.helper will be undefined!
        console.log("example assembling", this.helper);
    }

}

let e = new Example("hoho", function () { return; })
console.log("So now i will try to reassemble...");
e.tryMe();

所以一个问题的核心是typescript将Example类转译成代码如下：

function Example(view, helper) {
    _super.call(this, view);
    this.helper = helper;
    console.log(this.helper);
}

而不是这个：

function Example(view, helper) {
    this.helper = helper;
    _super.call(this, view);
    console.log(this.helper);
}

如您所见，如果我将this.helper之前放置_super在 JavaScript 中，this.helper将始终在_assemble. 即使super会调用该_assemble函数。

但默认分配给它是在_super调用之后。所以如果super类将调用汇编。_assemble第一次在示例中的覆盖方法中将不可见。

所以我的问题是...

它是一个错误吗？

或者

我不知道什么？

现在我解决了我的问题，只是_assemble从super课堂上移除，并且总是从孩子那里调用它。但这只是感觉不对。

Nota Bene：这是编译后的 JavaScript 代码与固定的 JavaScript 代码演示：

TypeScript 通常的输出：

var __extends = (this && this.__extends) || function (d, b) {
    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
    function __() { this.constructor = d; }
    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
var Base = (function () {
    function Base(view) {
        this._assemble();
    }
    Base.prototype._assemble = function () {
        document.write("<p>abstract assembling for all base classes</p>");
    };
    return Base;
}());
var Example = (function (_super) {
    __extends(Example, _super);
    function Example(view, helper) {
        _super.call(this, view);
        this.helper = helper;
        console.log(this.helper);
    }
    Example.prototype.tryMe = function () {
        this._assemble();
    };
    Example.prototype._assemble = function () {
        _super.prototype._assemble.call(this);
        // at first run this.helper will be undefined!
        document.write("<p>example assembling <b/>" + (this.helper) + "</b></p>");
    };
    return Example;
}(Base));
var e = new Example("test", function () { return "needle"; });
document.write("<p><i>So now i will try to reassemble...</i></p>");
e.tryMe();

TypeScript 修复了 javascript 输出：

var __extends = (this && this.__extends) || function (d, b) {
    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
    function __() { this.constructor = d; }
    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
var Base = (function () {
    function Base(view) {
        this._assemble();
    }
    Base.prototype._assemble = function () {
        document.write("<p>abstract assembling for all base classes</p>");
    };
    return Base;
}());
var Example = (function (_super) {
    __extends(Example, _super);
    function Example(view, helper) {
        /**
         * Slight change, compiled assigning to this BEFORE _super.
         */
        this.helper = helper;
        _super.call(this, view);
        console.log(this.helper);
    }
    Example.prototype.tryMe = function () {
        this._assemble();
    };
    Example.prototype._assemble = function () {
        _super.prototype._assemble.call(this);
        // at first run this.helper will be undefined!
        document.write("<p>example assembling <b/>" + (this.helper) + "</b></p>");
    };
    return Example;
}(Base));
var e = new Example("test", function () { return "Needle"; });
document.write("<p><i>So now i will try to reassemble...</i></p>");
e.tryMe();

4

1 回答 1

5

孩子不能在父母“存在”之前出生。

在 Java 和其他 OOP 语言中，必须在实例化当前对象之前调用 super()。

这是合乎逻辑的，因为child cannot be born before parent.

TypeScript 2 现在可以在之前有语句super，如果它们不使用 to 的话this。

this这是为什么不能在晚餐前使用的答案的一部分。

构造函数中使用的子覆盖方法应该完全存在于“父”资源上。

问题涉及的下一部分是，当这个孩子根本没有被实例化时，这个parent对象实际上调用了它的孩子的覆盖。assemble

这看起来很奇怪，因为孩子们没有被实例化，但是父构造函数调用了孩子们的方法......而且看起来很不自然，就像未出生的孩子说“爸爸”一样。

请参阅有关此问题的类似帖子。

但这样思考是错误的。将在构造函数中使用的孩子的覆盖，纯粹是为了改变您的孩子将被实例化的方式。

父构造函数中使用的方法覆盖必须说明您的实例应该如何制作。来自父级可用的资源，但不来自不存在的实例拥有的资源。

鸭子类型原型和继承...

原型中的继承通常通过将具有extend此类功能的新原型组合在一起来实现。

var __extends = (this && this.__extends) || function (d, b) {
    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
    function __() { this.constructor = d; }
    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};

从这个角度来看，没有“孩子”和“父母”之类的，但有“套”之类的。只有当集合已经存在时，它才能被另一个集合扩展。这使我们：

自上而下和自下而上的设计。

原型和鸭式打字以自下而上的设计工作。自上而下设计中的 OOP。

在这种情况下如何解决这种奇怪的情况？

只是不要！通过学习和实施，利用 OOP 思想的力量！这里如何成功：

  • 组合优于继承，重新思考代码设计。将基类拆分为接口和一个类，您可以将其实例传递给“子”类的构造函数，并通过实现已声明的接口来组成所需的实例。

  • 使用 static，但请注意，此更改对于您的对象的所有实例都是相同的。

    如果您仅将其用于依赖注入，则可以

  • 智能覆盖。

    不要使用兄弟（“子”）实例的额外资源，并创建一个自己的额外方法，该方法将从构造函数中调用。

    下面的例子（请注意，这并不违反 LSP，因为__assembled在构造函数中只设置了一次）：

    abstract class Base {

    constructor(view: string) {
        this._assemble();
    }

    protected _assemble(): void {
        console.log("abstract assembling for all base classes");
    }

}

class Example extends Base {

    private __assembled: boolean = false;

    constructor(view: string, private helper: Function) {
        super(view);
        this._assemble_helper();
        this.__assembled = true;
    }

    public tryMe(): void {
        this._assemble();
    }

    protected _assemble(): void {
        super._assemble();
        // removed from here all extra resources
        // but run them when u need to assemble them again.
        if (this.__assembled) {
            this._assemble_helper();
        }
    }

    protected _assemble_helper(): void {
        // at first run this.helper will be undefined!
        console.log("example assembling", this.helper);
    }

}

let e = new Example("hoho", function () { return; })
console.log("So now i will try to reassemble...");
e.tryMe();

这是转译后的 ES5 结果：

var __extends = (this && this.__extends) || function (d, b) {
    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
    function __() { this.constructor = d; }
    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
var Base = (function () {
    function Base(view) {
        this._assemble();
    }
    Base.prototype._assemble = function () {
        console.log("abstract assembling for all base classes");
    };
    return Base;
}());
var Example = (function (_super) {
    __extends(Example, _super);
    function Example(view, helper) {
        var _this = _super.call(this, view) || this;
        _this.helper = helper;
        _this.__assembled = false;
        _this._assemble_helper();
        _this.__assembled = true;
        return _this;
    }
    Example.prototype.tryMe = function () {
        this._assemble();
    };
    Example.prototype._assemble = function () {
        _super.prototype._assemble.call(this);
        // removed from here all extra resources
        // but run them when u need to assemble them again.
        if (this.__assembled) {
            this._assemble_helper();
        }
    };
    Example.prototype._assemble_helper = function () {
        // at first run this.helper will be undefined!
        console.log("example assembling", this.helper);
    };
    return Example;
}(Base));
var e = new Example("hoho", function () { return; });
console.log("So now i will try to reassemble...");
e.tryMe();

于 2016-12-08T19:33:31.460 回答