模块课程(1/2)
类型化函数
函数是任何 JavaScript 应用程序的基本构建块。在 TypeScript 中,我们可以精确地注释输入参数和返回值,使我们的接口和函数调用极其安全和自记录。
可选和默认参数
在 JavaScript 中,每个参数都是可选的,如果省略,则默认为 undefined。在 TypeScript 中,默认情况下,每个声明的参数都是必需的。
但是,我们可以使用问号(?)定义可选参数,或者直接在函数签名中指定默认值。
1. 可选参数
可选参数必须位于所有强制参数的之后:
function greetUser(name: string, title?: string): string {
if (title) {
return `Good morning ${title} ${name}`;
}
return `Hello ${name}`;
}2. 默认参数
如果没有为具有默认值的参数提供值,TypeScript 会推断其类型并分配指定的默认值:
function greetUserWithDefault(name: string, prefix: string = 'Hello'): string {
return `${prefix} ${name}`;
}其余参数 (...args)
当我们想要接受可变数量的参数时,我们可以使用剩余运算符。在 TypeScript 中,这些参数必须以数组形式输入:
function sumAll(message: string, ...numbers: number[]): string {
const total = numbers.reduce((sum, n) => sum + n, 0);
return `${message} ${total}`;
}函数类型(调用签名)
我们可以独立定义函数的类型,然后在变量声明或回调参数中重用它:
// Define function type using type alias
type MathOperation = (a: number, b: number) => number;
const add: MathOperation = (x, y) => x + y;
const multiply: MathOperation = (x, y) => x * y;当将函数作为参数传递给其他函数(回调)时,这种方法至关重要。
自己尝试一下
练习 1:可选参数
创建一个名为 formatName 的函数,该函数接受firstName 参数(字符串)和可选的lastName 参数(字符串)。如果提供了姓氏,则返回“firstName姓氏”,否则仅返回“firstName”。
显示提示
请记住,可选参数是在强制参数之后使用 lastName?: 字符串声明的。
3 次尝试后可用的解决方案
练习 2:默认参数
创建一个名为 power 的函数,它接受基数(数字)和指数(默认值为 2 的数字)。该函数必须计算并返回底数到指数的值(使用 Math.pow)。
显示提示
在函数签名中使用基数:number 和指数:number = 2。
3 次尝试后可用的解决方案
练习 3:函数签名
定义一个名为 BinaryOp 的类型别名,它描述一个接受两个数字参数并返回一个数字的函数。接下来,声明一个名为 sum 的 BinaryOp 类型常量,用于实现加法。
显示提示
函数类型的语法为 (a: number, b: number) => number。
3 次尝试后可用的解决方案
练习 4:回调函数
创建一个名为 processItems 的函数,它接受两个参数:items(字符串数组)和回调(接受单个字符串且不返回任何内容的函数,即 void)。该函数必须对 items 中的每个元素运行 for...of 循环并将其传递给回调。
显示提示
将签名声明为 processItems(items: string[], callback: (item: string) => void): void 并使用循环来调用回调。
3 次尝试后可用的解决方案