TypeScript重载函数的作用案例

C++中的一个概念(百度百科):

函数重载个别指重载函数。 重载函数是函数的一种非凡状况，为方便使用，C++容许在同一范畴中申明几个性能相似的同名函数，然而这些同名函数的形式参数（指参数的个数、类型或者程序）必须不同，也就是说用同一个函数实现不同的性能。这就是重载函数。

简要总结就是

函数的名称雷同, 然而参数不同的几个函数, 就是函数的重载。

1.Vue3 ref申明办法的源码中重载函数案例

2.举一个利用场景中的案例毛病

function ToAdd (a: string | number, b: string | number): string | number | undefined {// 只须要字符串合并if (typeof a === 'string' && typeof b === 'string') {return `${a + b}`;};// 只须要数字想加if (typeof a === 'number' && typeof b === 'number') {return a + b;};}

大量联结类型有两个毛病:

如果业务中有相似的需要，增加大量联结类型申明 须要专门的逻辑进行判断，而且最终返回值是 string 还是 number 也不能确定。

编辑器提醒无奈确定是 string 还是 number。

3.应用重载函数解决问题

//  重载申明2次 不须要加函数体function ToAdd(a: number, b: number): number;function ToAdd(a: string, b: string): string;function ToAdd(a: any, b: any): any {if (typeof a === 'string' && typeof b === 'string') {return `${a + b}`;}return a + b;}
const test = ToAdd(1, '233'); // 异样提醒

异样提醒

// 编辑器也能辨认出对应类型const addString = ToAdd('233', '233'); // 正确 编辑器辨认出 const addString: stringconst addNum = ToAdd(1, 1); // 正确 编辑器辨认出 const addNum: number