打字稿类型、泛型和抽象类

Question

我尝试了一种对我来说似乎很奇怪的行为。

让我们考虑以下示例 (test it in Typescript playground)：

abstract class FooAbstract {
    abstract bar() {}
}

class Foo extends FooAbstract { 
    bar() { 
        return { bar: 'bar' };
    }
}

class FooMaker<FOO extends FooAbstract> {  
    constructor(public foo: FOO) {}

    bar() { 
        return this.foo.bar();
    }

    baz = () => { 
        return this.foo.bar();
    }
}

let foo = new Foo();
let result = foo.bar();

let foomaker = new FooMaker(new Foo);
let foo2 = foomaker.foo; // Type "Foo", OK
let result1 = foomaker.foo.bar(); // Type "{bar: string}", OK
let result2 = foomaker.bar(); // Type "{}", ???
let result3 = foomaker.baz(); // I've seen comments about using a lambda... Not better

result2 和 result3 的类型类似于抽象 bar 函数 ({})。似乎this 没有解析为具体类Foo，而是解析为抽象类FooAbstract。而foo2 的类型表明foo 类属性已正确解析。

发生了什么事？我做错了什么吗？

---

更新

事后考虑，这个案例可以这样重新表述 (Test it in Typescript playground)：

class Foo {
    bar() {
        return { bar: 'bar' };
    }

    getThis(): this {
        return this
    }
}

class Wrapper {  
    bar<FOO extends { bar(): {} }>(foo:FOO) {
        return foo.bar();
    }
}

let wrapper = new Wrapper();
let result = (new Foo()).bar();
let result2 = wrapper.bar(new Foo());

result 的类型为 {bar:string}
result2 的类型为 {}（来自界面）。
wrapper.bar 的类型为 Wrapper.bar<Foo>(foo: Foo): {}

通过这个示例，更清楚的是，即使知道FOO 的类型为Foo，Typescript 使用FOO 定义而不是其显式类型作为bar 返回类型。

---

更新 2

好吧，在与打字作斗争时，我想我升级了。这个概念确实是 Typescript 中的隐式类型不遵循任何继承模型，即使在推导类型时也是如此。好吧，我仍然想知道为什么或它会改变，但我必须应对“它就是那样”。所以在这种情况下，类型必须是明确的。

我找到了一种更简单的方法来编写他的示例 (try it in Typescript playground)：

abstract class FooAbstract {
    abstract bar(): {}
}

class Foo extends FooAbstract { 
    bar() { 
        return { bar: 'bar' };
    }
}

class FooMaker<FOO extends FooAbstract, BAR> {  
    constructor(public foo: FOO & { bar: () => BAR } ) {       
    }

    bar():BAR { 
        return this.foo.bar() as BAR;
    }
}

let foomaker = new FooMaker(new Foo());
let result = foomaker.bar();

result 获取类型 {bar:string} 并且无需将泛型放在任何地方。通过使用泛型引用接口，FooMaker.constructor 参数类型中的内容可以变得更简洁。

Answer 1

这是一个明确的答案和传递方法返回类型所需的示例。

问题

嵌入另一个对象的对象使用其内部声明的类型（在本例中为抽象类型）来确定其函数的返回类型。即使该对象类型已知（或显式声明）。

换句话说，Typescript 类型推断不会查看对象方法内部来推断类型。

解决方案

我发现处理这种情况的唯一解决方案是将泛型与方法/函数返回类型相关联，并将对象结构与它们匹配。

根据我的问题更新 2 (test it in Typescript playground)：

interface TestInterface<ASNUM, ASSTRING, ASOBJECT> {
    asNum: () => ASNUM
    asString: () => ASSTRING
    asObject: () => ASOBJECT
}

interface BaseInterface extends TestInterface<any, any, any> { }

class Obj implements BaseInterface {
    constructor(private n: number) { 
    }

    asNum() {
        return this.n;
    }

    asString() {
        return this.n.toString();       
    }

    asObject() { 
        return {value: this.n};
    }
}

class Wrapper<T extends BaseInterface, ASNUM, ASSTRING, ASOBJECT> {
    constructor(private obj: T & TestInterface<ASNUM, ASSTRING, ASOBJECT>) {
    }

    asNum() {
        return this.obj.asNum() as ASNUM;
    }

    asString() {
        return this.obj.asString() as ASSTRING;
    }

    asObject() {
        return this.obj.asObject() as ASOBJECT;
    }
}

let w = new Wrapper(new Obj(5));
let myNum = w.asNum();       // type: number
let myString = w.asString(); // type: string
let myObject = w.asObject(); // type: {value: number}

类型没问题！

替代方案

我没有找到很多关于此或对 Typescript 2.3 的文档/即将推出的功能有所帮助的内容。关于可能有助于形成更好解决方案的事情：

• 这里有一篇关于 variadic types 的帖子，也许这有助于改进这样的示例（虽然不确定）：https://github.com/Microsoft/TypeScript/issues/5453
• 关于this 引用，在使用--noImplicitThis 编译选项和ThisType<T> 函数显式声明时，这里提到了强类型。但显然它更多的是关于一个函数了解其嵌入结构类型，而不是遵循对象模型流程。在我的情况下它没有帮助。

Answer 2

这就是关于 bar 函数的类型解析如何工作的全部内容：

bar() { 
    return this.foo.bar();
}

this.foo 是什么？ FOO 或更准确地说，是扩展 FooAbstract 的类，因为与属性 foo 不同，bar 不会暴露 FOO。必须在定义实际类型 FOO 之前确定类型。

如果你真的想打字，你必须这样做：

abstract class FooAbstract<T extends {}> {
    abstract bar(): T
}

class Foo extends FooAbstract<{ bar: string }> { 
    bar() { 
        return { bar: 'bar' };
    }
}

class FooMaker<FOO extends FooAbstract<BAR>, BAR> {  
    constructor(public foo: FOO) {}

    bar():BAR { 
        return this.foo.bar();
    }

    baz = (): BAR => {
        return this.foo.bar();
    }
}

let foo = new Foo();
let result = foo.bar();

let foomaker = new FooMaker<Foo, { bar: string}>(new Foo);
let foo2 = foomaker.foo; // Type "Foo", OK
let result1 = foomaker.foo.bar(); // Type "{bar: string}", OK
let result2 = foomaker.bar(); // Type "{bar: string}", OK
let result3 = foomaker.baz(); // Type "{bar: string}", OK

不幸的是，你必须明确定义 FooMaker 的类型，但你确实阻止了这样的事情：

let foomaker = new FooMaker<Foo, { bar: number}>(new Foo);