如何在TypeScript中优雅合并两个仅参数类型不同的函数类型？

方案1：等价于原实现的简化写法 #

你可以直接对两个函数的联合类型使用Parameters和ReturnType工具，省去定义多个中间类型的步骤，写法更紧凑：

type WrapPageElement = (
  args: Parameters<GatsbyBrowser['wrapPageElement'] | GatsbySSR['wrapPageElement']>[0],
  options: Parameters<GatsbyBrowser['wrapPageElement'] | GatsbySSR['wrapPageElement']>[1]
) => ReturnType<GatsbyBrowser['wrapPageElement'] | GatsbySSR['wrapPageElement']>

这个定义和你原有的WrapPageElement类型完全等价。

方案2：贴合「仅依赖交集」需求的更安全写法 #

你提到使用场景只依赖两个args的交集属性，同时这两个函数的options、返回值类型本身完全一致，那可以直接用更直观的写法，还能避免误用到单端独有属性：

type WrapPageElement = (
  args: WrapPageElementBrowserArgs & WrapPageElementNodeArgs,
  options: PluginOptions
) => ReactElement

如果不想直接依赖WrapPageElementBrowserArgs和WrapPageElementNodeArgs的显式引入，也可以通过索引类型推导：

type WrapPageElement = (
  args: Parameters<GatsbyBrowser['wrapPageElement']>[0] & Parameters<GatsbySSR['wrapPageElement']>[0],
  options: Parameters<GatsbyBrowser['wrapPageElement']>[1]
) => ReturnType<GatsbyBrowser['wrapPageElement']>

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