typescript - 包装重载的 Typescript 函数

Question

我在为重载函数编写包装器时遇到问题。

我包装的函数是 the SendGrid email sending function .该函数重载为(简化):

declare class MailService {
  send(data: Email): foo;
  send(data: Email[]): foo;
}

我想编写一个可以接受 Email 或 Email[] 的函数。但是当我这样做时，它会提示没有与调用匹配的过载:

function sendEmailWrapper1(data: Email | Email[]) {
  sendGrid.send(data)
}

但是，这是可行的:

function sendEmailWrapper2(data: Email | Email[]) {
  if ('length' in data) {
    sendGrid.send(data)
  } else {
    sendGrid.send(data)
  }
}

我认为发生的事情是 Email | Email[] 不是 send(data: Email) 或 send(data: Email[]) 的有效输入，Typescript 也不是意识到重载意味着 sendGrid.send(data) 应该是有效的(事实上，如果 if 和 else 分支可以有相同的代码并且是有效的，这使得 Typescript 似乎应该能够意识到该语句是有效的，即使没有 if 语句来帮助它推断类型，因为 Typescript 仅在编译时并且不会'实际上并没有指导运行时代码执行以根据类型进行不同的函数调用。

我的两个问题:

1. 在这种情况下，最佳做法是什么？
2. 这只是 Typescript 编译器的一个缺点，还是 sendEmailWrapper1 无法编译但 sendEmailWrapper2 可以工作的充分理由？

谢谢!

Answer 1

这是 class MailService 声明的缺点。它可以像这样有一个更准确的类型定义:

declare class MailService {
  send(data: Email | Email[]): foo;
}

在我看来，最佳实践是在本地扩充类型定义。然后向包含更改的存储库提交拉取请求。

此外，这是一个使用剩余参数的包装器。它会让您付出更少的努力:

// Accepts on or more MailData objects.
// sendEmailWrapper3(data);
// sendEmailWrapper3(data, data1);
function sendEmailWrapper3(...data: MailData[]) {
  sendGrid.send(data);
}