面试题：TypeScript中可选参数使用?符号的场景分析

Question

请描述在TypeScript函数定义中，使用?符号来表示可选参数的典型场景，并举例说明如何正确定义和调用包含可选参数的函数，同时解释可选参数与默认参数在使用上的区别。

Answer 1

可选参数典型场景

在函数定义中，当某些参数不是每次调用函数时都必须提供，使用可选参数就很合适。比如，在一个获取用户信息的函数中，可能某些信息不是每次都需要获取，像用户的详细地址，大部分场景下获取基本信息即可，地址信息在特殊情况下才需要，此时地址参数就可以设为可选参数。

定义和调用包含可选参数的函数

function greet(name: string, message?: string) {
    if (message) {
        console.log(`${name}, ${message}`);
    } else {
        console.log(`${name}`);
    }
}

greet('Alice');
greet('Bob', 'How are you?');

在上述代码中，message 参数是可选的。调用 greet 函数时，可以只传递 name 参数，也可以同时传递 name 和 message 参数。

可选参数与默认参数的区别

• 可选参数：调用函数时可以不传该参数。在函数内部需要对可选参数进行存在性检查，如上面 greet 函数中对 message 是否存在进行了判断。
• 默认参数：如果调用函数时没有传递该参数，会使用定义函数时设定的默认值。例如：

function greetWithDefault(name: string, message = 'Hello') {
    console.log(`${name}, ${message}`);
}

greetWithDefault('Charlie');
greetWithDefault('David', 'Good day');

在 greetWithDefault 函数中，message 有默认值 Hello。调用函数时若不传递 message 参数，就会使用默认值；若传递了，则使用传递的值。而可选参数如果不传递，函数内该参数就是 undefined，需要额外判断。