TypeScript 中的重载构造函数

Shuvayan Ghosh Dastidar 2023年1月30日
  1. 在 TypeScript 中重载构造函数以初始化类
  2. 在 TypeScript 中使用静态工厂替代构造函数重载
TypeScript 中的重载构造函数

构造函数重载是编程中的一个基本概念。我们可以通过参数的数量和类型来区分同一类的不同构造函数。

TypeScript 还支持构造函数重载;但是,它不同于 C++ 或 Java 等语言中的传统构造函数重载。

本文将讨论使用构造函数重载来实现各种业务逻辑。

在 TypeScript 中重载构造函数以初始化类

在 TypeScript 中,可以通过声明多个构造函数或让单个构造函数伴随着 ? 来重载构造函数和联合运营商。但是,所有的构造函数都必须有一个共同的实现。

以下代码段解释了如何实现这一点。

class Fruits {
    public apple : string | number;
    public numBananas : number;
    public unknownFruit : string;
    // default
    constructor();

    // // parameterized constructors
    constructor(a : string );
    constructor(a : string , b : number );
    constructor(a : number , b : number, c : string );

    // common implementation
    constructor( a? : string | number, b? : number, c? : string ){

        this.apple = 0;
        if ( a !== undefined ){
            this.apple = a;
            if ( typeof a === "string"){
                console.log("Got apple of country: ", this.apple);
            } else if ( typeof a === "number") {
                console.log("Number of apples got: ", this.apple);
            }
        } else {
            console.log("Apple field assigned 0 by default constructor");
        }
        this.numBananas = b ?? 0;
        this.unknownFruit = c ?? "";
    }
}
var fruitDefaultConstrutor = new Fruits();
var fruitWithOnlyAppleDecalred = new Fruits("India");
var fruitWithAppleBananaDecalred = new Fruits("India", 4);
var fruitWithAppleBananaUnkwownDeclared = new Fruits(8, 4, "Orange");

输出:

"Apple field assigned 0 by default constructor"
"Got apple of country: ",  "India"
"Got apple of country: ",  "India"
"Number of apples got: ",  8

我们在 Fruits 类中定义了多个构造函数。默认构造函数没有参数,而其他构造函数具有不同数量的不同类型的参数。

所有的构造函数都有一个实现。参数的各种类型由联合运算符或|表示如 a? : 字符串 |数字

在一个参数之后,? 运算符表示在调用构造函数时该字段可能保持为空,允许我们通过单个实现来实现不同的构造函数定义。

然而,调用 new Fruits("India", 4, "Orange") 会给出错误,因为没有兼容的构造函数定义,尽管满足通用实现方法的类型。

我们可以通过删除构造函数定义并仅使用通用实现来改进这一点。

class Fruits {
    public apple : string | number;
    public numBananas : number;
    public unknownFruit : string;

    // common implementation
    constructor( a? : string | number, b? : number, c? : string ){

        this.apple = 0;
        if ( a !== undefined ){
            this.apple = a;
            if ( typeof a === "string"){
                console.log("Got apple of country : ", this.apple);
            } else if ( typeof a === "number") {
                console.log("Number of apples got : ", this.apple);
            }
        } else {
            console.log("Apple field assigned 0 by default constructor");
        }
        this.numBananas = b ?? 0;
        this.unknownFruit = c ?? "";
    }
}

输出:

"Got apple of country : ",  "India"

因此,可以重载构造函数以初始化不同的字段或设置一些初始逻辑。

在 TypeScript 中使用静态工厂替代构造函数重载

当处理许多构造函数并使用 ? 时,构造函数重载逻辑很快就会变得丑陋。和联合运算符。初始化类的另一种方法是通过 TypeScript 中的静态工厂模式。

下面的代码段将讨论我们如何实现这一点。

class Fruits {
    public apple : string | number;
    public numBananas : number;
    public unknownFruit : string;

    constructor(){
        this.apple = "";
        this.numBananas = 0;
        this.unknownFruit = "";
    }
    static fromAppleCountry( a : string) : Fruits {
        var fruits = new Fruits();
        fruits.apple = a;
        console.log("Got apple of country : ", fruits.apple);
        return fruits;
    }
}

var fruitWithOnlyAppleDecalred = Fruits.fromAppleCountry("India");

输出:

"Got apple of country : ",  "India"
Shuvayan Ghosh Dastidar avatar Shuvayan Ghosh Dastidar avatar

Shuvayan is a professional software developer with an avid interest in all kinds of technology and programming languages. He loves all kinds of problem solving and writing about his experiences.

LinkedIn Website

相关文章 - TypeScript Constructor