打字稿：如何在扩展第一个接口的另一个接口中重载一个接口的功能答案

【问题标题】：typescript: how to overload a function of an interface in another interface that extends the first one打字稿：如何在扩展第一个接口的另一个接口中重载一个接口的功能
【发布时间】：2021-07-09 21:12:21
【问题描述】：

我正在开发一个电容器插件，我需要定义可能的事件监听器。

该插件的旧实现有一个大接口，所有可能的侦听器都在同一个文件中，例如：

export interface Plugin {
 
 addListener(
    eventName: 'bannerShow',
    listenerFunc: (info: any) => void,
  ): PluginListenerHandle;

 addListener(
    eventName: 'bannerHide',
    listenerFunc: (info: string) => void,
  ): PluginListenerHandle;

 addListener(
    eventName: 'rewardShow',
    listenerFunc: (info: SomeInterface) => void,
  ): PluginListenerHandle;

 addListener(
    eventName: 'rewardHide',
    listenerFunc: (info: string) => void,
  ): PluginListenerHandle;

}

我将其分开，这样更容易维护，以这种方式：

export interface Plugin extends Banner, Reward {
  // General plugin calls here
}

// Other file
export interface Banner {

specificBannerFunction(): void;

addListener(
    eventName: 'bannerShow',
    listenerFunc: (info: any) => void,
  ): PluginListenerHandle;

 addListener(
    eventName: 'bannerHide',
    listenerFunc: (info: string) => void,
  ): PluginListenerHandle;
}

// Other file
export interface Reward {

 specificRewardFunction(): string;
 addListener(
    eventName: 'rewardShow',
    listenerFunc: (info: SomeInterface) => void,
  ): PluginListenerHandle;

 addListener(
    eventName: 'rewardHide',
    listenerFunc: (info: string) => void,
  ): PluginListenerHandle;
}

问题是 Typescript 说：

接口“插件”不能同时扩展类型“横幅”和“插页式”。 'Banner' 和 'Interstitial' 类型的命名属性 'addListener' 不相同

如何让 typescript 知道我正在重载该函数调用？

【问题讨论】：

标签： typescript

【解决方案1】：

我自己对 TS 还是很陌生，所以我不知道您是否可以使用接口执行此操作，但如果您将Plugin 接口更改为type，您可以使用交集。

例如代替：

export interface Plugin extends Banner, Reward {
  // General plugin calls here
}

你可以这样做：

export type Plugin = Banner & Reward & { /* General plugin calls here */ }

【讨论】：

一般来说，您可以使用静态已知键使接口扩展任何命名类型...因此type BasePlugin = Banner & Reward; 后跟interface Plugin extends BasePlugin { /* Other stuff here */ } 将起作用。
哦！我对 Typescript 很陌生，但我只是没有看到 type + interface 的可能性。谢谢！丹安杰卡尔兹