要了解这里发生了什么，我们需要了解 hof 函数允许使用传递给它的 cb 的方式。

什么论据可以通过？

让我们考虑一个简单的例子，只包含一个参数。

function hof(cb: (a: number | string) => number | string) {}

因此， hof 表示它需要一个回调函数 cb ，它接受一个可以是数字或字符串的参数，并返回一个字符串或一个数字。

现在，考虑一下TS在 hof 上可以传递给 cb 的限制。因此， hof 可以使用 number 或 string 调用 cb ，这是可以的，因为 hof 已经声明它接收到的 cb 应该能够同时处理数字和字符串。

但是，如果将以下 double 函数传递给 hof ，TS会发出抱怨：

function double(a: number): number {
  return 2 * a
}

这是有意义的，因为 hof 可以用 string 调用这个 double 函数，这可能会破坏 double 函数，因为它只接受数字。

还请注意抛出错误的位置，它是在用 double 调用 double 的地方抛出的，这表明 hof 的调用方式有问题，而不是如何实现它。

function hof(cb: (a: number | string) => number | string) {}
function double(a: number): number {
  return 2 * a
// @ts-expect-error
hof(double)

因此，传递给 hof hof 的回调应该能够处理允许 hof 传递给回调的一组参数。

​

​

如何使用返回类型？

现在，让我们看看 hof 如何使用 cb 返回的值。

因为 cb 可以返回一个 number 或一个 string ，所以 hof 有责任明智地使用返回值，这意味着 hof 不应该假设返回的值总是数字或字符串， hof 需要在做出任何这样的假设之前设置适当的类型保护。

function hof(cb: (a: number | string) => number | string) {
  // @ts-expect-error
  const fixed = cb(100).toFixed() // wrong assumption that the returned value is always a number
function hof(cb: (a: number | string) => number | string) {
  const ret = cb(100)
  if (typeof ret === "number") { // appropriate check to make sure that it's a number
    const fixed = ret.toFixed();
}

再次注意抛出错误的位置，它是在函数体中抛出的，这表明函数的实现存在问题。

传递给 hof 的回调也可以返回一个 number ，TS对此绝对没有问题。

function hof(cb: (a: number | string) => number | string) {}