函数
函数是 JavaScript 应用程序的基础。在 TypeScript 里函数仍然是主要的定义行为的地方
在 JavaScript 中,常见函数定义形式
function add(x, y) {
return x + y;
}
let add = function (x, y) {
return x + y;
};
在 TypeScript 定义函数
让我们为上面那个函数添加类型
function add(x: number, y: number): number {
return x + y;
}
let add = function (x: number, y: number): number {
return x + y;
};
返回值类型
我们可以给每个参数添加类型之后再为函数本身添加返回值类型,返回值类型是函数类型的必要部分,有返回值的可以添加返回值类型,如果函数没有返回任何值,你也必须指定返回值类型为 void 而不能留空。这样就得到了完整的函数类型写法,如下
有返回值的标注返回值类型
const add = (x: number, y: number): number => {
return x + y;
};
void
无返回值的标注const add = (x: number, y: number): void => {
console.log(x + y);
};
提示
返回值一般会自行推断
函数参数
TypeScript 里的每个函数参数都是必须的。 这不是指不能传递 null
或undefined
作为参数,而是说编译器检查用户是否为每个参数都传入了值。 编译器还会假设只有这些参数会被传递进函数。 简短地说,传递给一个函数的参数个数必须与函数期望的参数个数一致。
函数定义之后,输入多余的(或者少于要求的)参数,是不被允许的
const add = (x: number, y: number): void => {
console.log(x + y);
};
add(1, 2);
add(1); //报错
add(1, 2, 3); //报错
可选参数
JavaScript 里,每个参数都是可选的,可传可不传。 没传参的时候,它的值就是 undefined。 在 TypeScript 里我们可以在参数名旁使用 ?
实现可选参数的功能。 比如,我们想让参数 y 是可选的
function add(x: number, y?: number): number {
//指定返回值类型为number类型
if (y) {
return x + y;
} else {
return x;
}
}
console.log(add(1)); // 1
console.log(add(1, 2)); //3
提示
可选参数必须跟在必须参数后面,可选参数后面不允许再出现必需参数了。 如果上例我们想让 x 是可选的,那么就必须调整它们的位置,把参数 x 放在后面。
参数默认值
在 TypeScript 里,我们也可以为参数提供一个默认值,当用户没有传递这个参数或传递的值是undefined
时。 它们叫做有默认初始化值的参数。 让我们修改上例,把参数 y 的默认值设置为 100。需要注意的是,在所有必须参数后面的带默认初始化的参数都是可选的,可选参数与末尾的默认参数共享参数类型
function add(x: number, y = 100): number {
//指定返回值类型为number类型
return x + y;
}
console.log(add(1)); // 101
console.log(add(1, 2)); //3
提示
虽然默认参数算作可选参数,与普通可选参数不同的是,带默认值的参数不需要放在必须参数的后面。
剩余参数
ES6 中,可以使用 ...rest
的方式获取函数中的剩余参数(rest 参数),这里使用的不多,只需了解即可
let func4 = (x: number, y: number, ...args: any): void => {
console.log(args); // [ 3, 4, 5, 6 ]
console.log(...args); // 3 4 5 6
};
func4(1, 2, 3, 4, 5, 6);