函数类型
在 TypeScript 中,函数类型提示是一种方法,用于声明函数的类型信息。它允许你在编写函数时指定参数的类型和返回值的类型,从而增加了代码的可读性和可维护性,同时还能在编译时进行类型检查。
函数类型提示有两种方式:分别是函数声明和箭头函数。
function add(x:number,y:number):number{return x+y;
}
const add = (x:number,y:number):number =>{return x+y;
}
注意。在函数类型提示中,参数和返回值的类型声明都是可选的。如果你省略了类型声明,TypeScript 会根据上下文进行类型推断。但是,通常为了代码的清晰和可读性,最好还是明确地声明函数的类型。
这里的类型还支持更加复杂的类型,1比如可选参数,默认参数和剩余次数
可选参数和默认参数:
function greet(name: string, greeting: string = "Hello", punctuation?: string): string {if (punctuation) {return `${greeting}, ${name}${punctuation}`;} else {return `${greeting}, ${name}`;}
}
(greeting的参数类型是string,默认值是Hello,punctation的参数类型是stiring,但其背后紧跟了一个?,说明他是可选的)
【注意:如果有可选参数,你不能直接在函数体种直接运用可选参数,必须进行判断,比如if判断可选参数是否为undefined】
【注意2!:可选参数和默认参数不可能是同一个参数噢(因为默认参数就是不传的时候值为默认值)】
剩余参数:
是 TypeScript 中用于表示函数可以接受不定数量的参数的一种方式。它允许你定义一个参数,用来收集函数调用时传入的多余参数,将它们收集到一个数组中。
在函数类型提示中,剩余参数使用省略号 (
...
) 表示,紧跟在参数名的后面。通常,剩余参数会放在函数参数列表的最后面。
function sumAll(...numbers: number[]): number {return numbers.reduce((total, num) => total + num, 0);
}const result = sumAll(1, 2, 3, 4, 5);
console.log(result); // 输出:15
参数还可以是接口类型,这样子可以有类型提示
比如
interface getUserListRequest {page?:numberlimit?:numberkey?:stringname?:string
}function getUserList(params:getUserListRequest){console.log(params.limit) // 有类型提示
}
另外,ts是支持函数重载的,而js不支持
函数重载允许为同一个函数提供多个函数类型定义,在不同的参数组合或返回值类型下执行不同的实现。
function double(value: number): number;
function double(value: string): string;
function double(value: any): any {if (typeof value === 'number') {return value * 2;} else if (typeof value === 'string') {return value.repeat(2);}
}const result1 = double(10); // result1 的类型为 number,值为 20
const result2 = double('hello'); // result2 的类型为 string,值为 'hellohello'