typescript - 如何描述函数的返回类型，它是调用传递的泛型函数的结果

Question

问题是如何描述函数bar的返回类型，它应该是泛型函数fn的执行结果。

function foo(fn<T>) /*return →*/ function bar<B> /*return →*/ call fn<B>()

例子:

function foo<T extends <X>(...args: any) => any>(fn: T) {
    return function bar<B>(): ReturnType<typeof fn> /**👈*/ {
        return fn<B>({ /*config*/ });
    }
}

{
    const f1 = <T>() => Promise.resolve(({/*input*/ } as T));
    const x1 = foo(f1)
    const y1 = x1<{ a: 'A' }>()/**Promsise<unknown>❌*/.then(data => data.a); // should be Promise<{ a: 'A'}> ✅
    const y12 = x1<{ b: 'B' }>()/**Promsise<unknown>❌*/.then(data => data.b); // should be Promise<{ b: 'B'}> ✅
}

{
    const f2 = <T>() => ({/*input*/ } as T);
    const x2 = foo(f2)
    const y2 = x2<{ a: 'A' }>()/**unknown❌*/.value // should be { a: 'A'} ✅
    const y21 = x2<{ b: 'B' }>()/**unknown❌*/.value // should be { b: 'B'} ✅
}

谢谢🙏

更新 1 🚧:

TypeScript 相关问题

• https://github.com/microsoft/TypeScript/issues/37181
• https://github.com/microsoft/TypeScript/issues/40542

Answer 1

这个问题很有趣，作为一名平台工程师，我在这个领域尝试过很多编码技术，所以我想分享一些建议。

我发现泛型本身并不能提供完整的解决方案或最易读的代码。在处理 API 调用时，它可以帮助制定需求并提供具有不同职责的层。这是我在自己的应用程序中使用的示例方法 - 通过 React + Axios 表达。

要求

• React View 在处理 API 负载时必须获得类型安全的体验
• 可靠性和重试必须由多个应用中使用的共享类来处理，例如重试 API 调用、实现断路器或其他
• 代码必须简单易读

代码片段

• React view model使用类型化的 API 实体而不进行转换，并且 UI 以类型安全的方式呈现它。所有 View 和 View 模型都会获得这种体验。

• Fetch class实现低级别的东西，可以在多个应用程序之间共享。有一次我在这里使用了泛型，代码的可读性大大降低。

• Service agent class .一个简单的适配器，其方法以最自然的方式为 View 提供服务。这里有 Actor ，但他们只在这一层。

• 其他地方limited generics被使用，例如调用axios.get<T> .但是，在许多地方使用具有独立请求和响应类型的泛型很快就会变得困惑。

结论

有时，关注点的分层和分离提供了最干净的解决方案，而不是过多地使用泛型。出于兴趣，该设计可移植到任何语言，我也将其用于移动应用程序:

• Swift API Calls in iOS
• Kotlin API Calls in Android

当然，我的代码可以改进，例如在转换前更好地验证——也许服务代理可以管理它。但是软件公司的所有开发人员都会理解我的代码，我认为这是最重要的结果。