如何在TypeScript中同时实现函数参数解构、默认值与整体对象可选？

这问题我之前开发时也踩过坑！要同时满足参数解构、属性默认值和整体参数可选这三个需求，关键是给整个解构的参数对象也设置一个默认值，具体实现如下：

原生JavaScript版本 #

function add({ num = 1 } = {}) {
  return num + 1;
}

验证各种调用场景 #

• add({ num: 2 }) → 返回 3（正常解构传入的num值）
• add({}) → 返回 2（解构空对象，num使用自身默认值1）
• add() → 返回 2（无参调用时，参数被赋值为默认空对象，num再触发自身默认值）

TypeScript版本（如果用TS开发） #

如果是TypeScript环境，需要给参数对象补充类型注解，同时保持整体默认值：

function add({ num = 1 }: { num?: number } = {}) {
  return num + 1;
}

这里给参数对象的num属性标记为可选（num?: number），配合整体默认值{}，TypeScript的类型检查也会完全通过。

为什么之前的写法无效？ #

• 第一种function add({ num = 1 }?) { ... }：JavaScript/TypeScript中没有这种语法，?可选标记只能用于单个参数，不能直接加在解构对象后面。
• 第二种function add({ num = 1 }?: { num: number }) { ... }：类型注解的位置错误，而且没有给整个参数设置默认值，无参调用时参数会是undefined，解构undefined会直接抛出错误，自然无法生效。

内容的提问来源于stack exchange，提问作者Joseph