TypeScript（十）函数重载

#TypeScript（十）函数重载| 来源: 网络整理| 查看: 265

函数重载

根据参数的类型执行不同的函数

多数用于传入不同的参数得到不同的结果

重载分为两个部分（缺一不可）：

声明实现例1：

假设我们有一个函数，可以接收string类型相拼接，也可以接收number类型相加。

// 声明： function add(arg1: string, arg2: string): string function add(arg1: number, arg2: number): number // 实现： function add(arg1: string | number, arg2: string | number) { // 在实现上我们要注意严格判断两个参数的类型是否相等，而不能简单的写一个 arg1 + arg2 if(typeof arg1 === 'string' && typeof arg2 === 'string') { return arg1 + arg2; } else if(typeof arg1 === 'number' && typeof arg2 === 'number') { return arg1 + arg2; } } 复制代码

注意：如果实现部分没有严格判断，会提示此重载签名与其实现签名不兼容。

函数重载只是多个函数声明，逻辑依旧要自己写，并不会吧我们声明的多个函数进行合并。

例2

写个函数test，当传入参数param是User时，不传入flag，当传入的参数是number时，传入flag

interface User { name: string; age: number; } declare function test(param: User | number, flag?: boolean): number; const user = { name: 'Jack', age: 18 } const res = test(user, false)// 虽然不报错，但是与想法未被，当传入的是User时应该不让传入flag 复制代码

重载解决上述问题：

interface User { name: string; age: number; } declare function test(params:User):number; declare function test(params:number, flag:boolean):number; const user = { name: 'jack', age: 666 }; // 类型"{name: string; age: number; }"的参数不能赋给类型"number"的参数。 const res = test(user, false); 复制代码实际项目中的用法：

有声明之后，需要有具体的实现

interface User { name: string; age: number; } const user:User = { name: 'jack', age: 123 } class oneClass { // 声明 public test(param: User): number; public test(param: number, flag: boolean): number; // 实现 public test(param: User | number, flag?: boolean) { if(typeof param === 'number') { return param+(flag ? 1 : 0) } else { return param.age } } } 复制代码

如果仅传入的参数不同，但是得到的结果是一样的，那么重载的意义不大。

function func (a: number): number function func (a: number, b: number): number //代替上面： function func (a: number, b?: number): number 复制代码 function func (a: number): number function func (a: string): number //替代上面 function func (a: number | string): number 复制代码

【本文地址】

公司简介

联系我们

今日新闻

推荐新闻

专题文章