typescript - 如何在 Typescript 中包装具有多个重载的函数？

Question

我正在尝试包装一个函数来用一些行为来装饰它。我能够创建一个具有多个重载的函数，但是即使重载的参数类型与包装函数的重载相匹配，如果没有类型保护函数，我似乎无法让它工作，这似乎很愚蠢。

这是一个 TS Playground 来说明我到目前为止的方法。

我所拥有的是：

function handleMainEvent(
  elem: HTMLFormElement,
  handler: FormSubmitHandler
)
function handleMainEvent(
  elem: HTMLIFrameElement,
  handler: MessageHandler
)
function handleMainEvent(
  elem: HTMLFormElement | HTMLIFrameElement,
  handler: FormSubmitHandler | MessageHandler
) {}

function handleMainEvent2(
  elem: HTMLFormElement,
  handler: FormSubmitHandler
)
function handleMainEvent2(
  elem: HTMLIFrameElement,
  handler: MessageHandler
)
function handleMainEvent2(
  elem: HTMLFormElement | HTMLIFrameElement,
  handler: FormSubmitHandler | MessageHandler
) {
  if (isHTMLIFrameElement(elem) && isMessageHandler(handler)) {
    return handleMainEvent(elem, handler);
  }
  else if (isHTMLFormElement(elem) && isFormSubmitHandler(handler)) {
    return handleMainEvent(elem, handler);
  }
}

...但我想写这样的东西：

function handleMainEvent2(
  elem: HTMLFormElement,
  handler: FormSubmitHandler
)
function handleMainEvent2(
  elem: HTMLIFrameElement,
  handler: MessageHandler
)
function handleMainEvent2(
  elem: HTMLFormElement | HTMLIFrameElement,
  handler: FormSubmitHandler | MessageHandler
) {
    return handleMainEvent(elem, handler);
  }
}

用任意行为来装饰具有多个重载的函数的最直接方法是什么？

标签： typescript