typescript中的重载

什么是函数重载
简单来说，函数重载具有两个特征：名称相同，参数不同（参数类型、个数不同。）所以，函数重载的解释应该是具备不同参数的同名函数。注意：函数重载是多态的一种体现。

函数重载的声明和实现
TypeScript中，函数重载主要包括两部分：函数声明，和函数实现。函数声明主要是TSC解析的一种声明体现，实际编译中，并不会编译成具体代码。我们可以通过TypeScript的playground来查看。
1、参数不同的函数重载
加入我们有一个打印函数，可以打印输入的一个string信息，我们可以将函数声明如下：

// 函数声明
function print(info: string): void;

而还有另一种情况，就是输入的有可能是两个string类型的参数，我们都需要打印下来，于是我们的函数声明可以是这样：

// 函数声明

function print(info: string, message: string): void;

而当这两种声明，同时存在TypeScript的声明文件中，我们就需要用函数重载来实现，这是JavaScript没有的特性。

而实现函数重载的要求就是，我们要在一个更为宽泛的范围去实现函数重载，所以，TypeScript中的我们实现print函数如下：

// 在更宽泛的范围，我们用可选参数来实现重载
function print(info: string, message ?: string) {
    let printValue: string = info;
    if(message){
        printValue += message;
    }
    console.log(printValue);
}

2、参数个数相同，但类型不同的函数重载
函数重载的第二种情况，参数个数相同，但是参数类型不一样，这种情况下也可以通过重载来实现。

比如，上述打印信息的函数，有可能接受的输入是一个string字符串，也有可能输入接受的是一个number类型的数字，那么我们第一步的函数声明便是如下：

function print(info: string): void;
function print(num: number): void;

从上可以看到，我们的函数声明中，参数的类型是不同的，在这种情况下，TypeScript是如何在一个宽泛的范围内实现呢？这里就要用到联合类型，如下所示：

function print(message: string | number) {
    console.log(message)
}

参数类型顺序不同：
function disp(n1:number,s1:string):void;
function disp(s:string,n:number):void;
实例
以下实例定义了参数类型与参数数量不同：
TypeScript

function disp(s1:string):void; 
function disp(n1:number,s1:string):void; 
 
function disp(x:any,y?:any):void { 
    console.log(x); 
    console.log(y); 
} 
disp("abc") 
disp(1,"xyz");

编译以上代码，得到以下 JavaScript 代码：
JavaScript

function disp(x, y) {
    console.log(x);
    console.log(y);
}
disp("abc");
disp(1, "xyz");

输出结果为：

abc
undefined
1
xyz

函数重载的总结
从我们实现两个函数重载的例子可以看出，我们在TypeScript中实现函数重载的方式分别是利用了TypeScript中的两个类型特性：可选类型以及联合类型。

所以，如果从便捷的角度来讲，我们如果是遇到了类似的实现，其实可以直接使用可选参数和联合类型来实现自己想要的函数效果。