TypeScript：具有自定义方法的工厂

Question

我在工厂工作，最终需要添加自定义方法。我无法使用 overloads 添加自定义方法，但是当我开始添加自定义方法时，一切都无法正常工作。 :(

我能够成功涵盖没有提供自定义方法的情况以及自定义方法参数类型错误的情况。

type Base = { id: string }
type Methods<T> = { [key: string]: (this: T) => unknown };

function factory<T extends Base>(method: (this: T) => void): (new () => T);
function factory<
    T extends Base & M,
    M extends Methods<T>
>(method: (this: T) => void, methods: M): (new () => T);
function factory<
    T extends Base & M,
    M extends Methods<T>
>(method: (this: T) => void, methods?: M): (new () => T) {
    return null as unknown as (new () => T);
}

// Ok: T = Base
factory(function() {
    this.id = this.a();
});

// Ok: 0 is not valid value for argument methods (we don't care about T in this case)
factory(function() {
    this.id = this.a();
}, 0);

如果我将有效值传递给自定义方法参数，则没有任何效果！ playground是一个检查问题详情的强大工具。

// Nothing working as desired
factory(function() {
    this.id = this.a();
}, {
    a: function(): string {
        this.a();
        this.b();
        return "0";
    }
});

如果我们鼠标悬停在factory函数名上，我们可以看到它的类型是：

function factory<Base & Methods<unknown>, {
    a: (this: Base & Methods<unknown>) => string;
}>

所以我们可以这么说

type T = Base & Methods<unknown>
type M = { a: (this: Base & Methods<unknown>) => string; };

这就是问题所在：既然T 是某种东西，为什么M 被解析为Methods<unknown> 而不是Methods<something>？

还有很多其他问题（b方法不被认为是错误，a方法被认为返回unknown而不是string作为对象的a属性传递为methods论点等）但似乎它们都是错误的M类型解析的副作用。

我强烈怀疑所有这些问题的根本原因是T 和M 之间以及T 和自身之间的循环依赖关系，但我不能没有因为

1. T 需要依赖 M 为其提供自定义方法；
2. M 需要依赖 T 来推断自定义方法的隐式 this 参数的类型。

知道如何实现这个吗？

Answer 1

TypeScript 从左到右解析/推断泛型。

在这种情况下，您需要先推断 Methods，然后再推断 method 本身。

我只是替换了第一个和第二个参数：

type Base = { id: string }

const factory = <
  T extends Base,
  Methods extends Record<string, <Self extends Methods>(this: T & Self) => unknown>,
 >(methods: Methods, method: (this: T & Methods) => void) => {
  return null as any
}

factory({
  a: function () {
    this.id = this.a(); // Ok: string
    const b = this.b(); // Ok: number
    const c = this.c(); // Ok: method does not exists
    return "0";
  },
  b: function () {
    this.id = this.a(); // Ok: string
    const b = this.b(); // Ok: number
    const c = this.c(); // Ok: method does not exists
    return 0;
  },
}, function () {
  this.id = this.a(); // Ok: string
  const b = this.b(); // Ok: number
  const c = this.c(); // Ok: method does not exists
});

Playgroud

为了推断每种方法的this，我使用了额外的通用参数<Self extends Methods>(this: T & Self) => unknown

如果您想知道为什么我添加了Self 而不是只使用Methods，请查看this 答案。

附：我有一条经验法则：如果您对参数推理有疑问 - 添加一个更通用的。通常它会有所帮助：D