TypeScript中带默认值的函数参数解构如何正确实现？

问题出在你定义的参数类型{ foo: string; bar: string }要求必须包含foo和bar两个必填属性，但默认值{}是空对象，并不满足这个类型的要求，所以TS会抛出类型不匹配错误。

以下是几种正确的改写方式：

方式一：将参数属性设为可选 #

直接在类型定义里把foo和bar标记为可选属性（用?），这样空对象或者不传参数都能符合类型要求，同时默认值会保证最终这两个属性都是string类型：

const test = ({
  foo = 'foo',
  bar = 'bar',
}: { foo?: string; bar?: string } = {}) => {
  return { foo, bar };
};

方式二：使用接口/类型别名（更适合复杂参数） #

如果参数结构比较复杂，提前定义接口或类型别名可以让代码更清晰：

type TestOptions = {
  foo?: string;
  bar?: string;
};

const test = ({
  foo = 'foo',
  bar = 'bar',
}: TestOptions = {}) => {
  return { foo, bar };
};

验证调用效果 #

这两种写法都能和原JavaScript代码保持一致的行为：

• test() → { foo: 'foo', bar: 'bar' }
• test({}) → { foo: 'foo', bar: 'bar' }
• test({ foo: 'cat' }) → { foo: 'cat', bar: 'bar' }

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