迹忆客 专注技术分享

当前位置:主页 > 学无止境 > 编程语言 > TypeScript >

TypeScript 中的重载构造函数

作者:迹忆客 最近更新:2023/03/09 浏览次数:

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

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

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

在 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 中的静态工厂模式。

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

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"

转载请发邮件至 1244347461@qq.com 进行申请,经作者同意之后,转载请以链接形式注明出处

本文地址:

相关文章

在 TypeScript 中返回一个 Promise

发布时间:2023/03/19 浏览次数:182 分类:TypeScript

本教程讨论如何在 TypeScript 中返回正确的 Promise。这将提供 TypeScript 中 Returns Promise 的完整编码示例,并完整演示每个步骤。

扫一扫阅读全部技术教程

社交账号
  • https://www.github.com/onmpw
  • qq:1244347461

最新推荐

教程更新

热门标签

扫码一下
查看教程更方便