TS中定义函数类型
写在之前
- TS对JS函数的修改是,为JS函数增加了强类型语言(C++等)函数的用法。
如何定义一个函数类型
基础用法
function add(x: number, y: number): number{ return x + y; }
上面的例子中,规定了函数add的第一个参数类型必须是number,第二个参数的类型必须是number,以及函数的返回值的类型必须是number。
我们也可以不定义函数的返回值类型,因为TS类型检查系统会对返回值进行类型推断。
function add(x: number, y: number){ return x + y; }
上面的例子中就没有为函数的返回值规定类型,但是TS类型检查会帮我们完成。
为剪头函数定义类型
const add = (x: number,y: number): number => { return x + y; }
当没有提供函数实现时,对函数类型进行声明的方法
interface addFunc{ (x: number,y: number): number; } interface obj{ add?: (x: number,y: number) => number; }
上面的例子中给出了2种直接为函数类型提供声明的方法,注意这里我们利用了interface,interface是可以用于约束引用类型和类的类型的。
const secondAdd: addFunc secondAdd = function(x,y){ return x + y; }
因为上面我们已经对函数类型进行了规定,这样我们在写函数实现的时候就不需要再进行类型规定。
可选参数
尽管我们在上面定义了函数形参每个参数的类型,但是为了实现函数重载,我们还可以引入可选参数(函数重载在C++中是指,声明多个功能相似的同名函数,但是这些同名函数的形参(个数、顺序、类型)中至少一个必须不同)。
function times(x: number,y?: number){ if(y){ return x* y; } return x; }
在上面的例子中,我们定义了可选参数,这样就既可以传入一个参数,也可以传入2个参数。同时传入不同个数参数时,执行逻辑不同,这样就实现了利用参数个数不同的函数重载。
剩余参数
ES6中提出了剩余参数的概念,TS在这个的基础上加了类型校验。
function add(x: number, ...restNums: number[]){ let res = x; for(let i = 0;i < restNums.length;i++) { res = res + restNums[i]; } return res; } add(1,2,3) // 6 add(1,2,3,4,5) //15