類型“ this”不可分配給類型“ T”

Question

我有以下課程：

class MyClass {

    public each<T extends MyClass>(callback: (item: T) => void): T {
        /* Loop through an array and apply the callback */
        return this;
    }

}


class MyClass2 extends MyClass {

    public before(html: string): MyClass2 {
        return this.each<MyClass2>(item => { /* Do Some Stuff */ });
    }

}

然后我得到這個錯誤：

[ts]類型'this'不能分配給類型'T'。

如何返回類實例？

Answer 1

要返回MyClass的實例，您需要將返回類型更改為MyClass

public each<T extends MyClass>(callback: (item: T) => void): MyClass {
    /* Loop through an array and apply the callback */
    return this;
}

Answer 2

您可以使用此類型來表示each實例each返回與其被調用的相同類型的實例：

class MyClass {

    public each<T extends MyClass>(callback: (item: T) => void): this {
        /* Loop through an array and apply the callback */
        return this;
    }

}

class Derived extends MyClass {
    foo: string;
}

let derived = new Derived;

derived = derived.each(() => {});

請注意，此類型不同於T -T是數組項的類型，它可能與調用each方法的實例類型相同或each 。

Answer 3

在each方法中，您應該返回基類，因為this引用了MyClass的類型。 before ，在您的before方法中，可以將MyClass對象轉換回MyClass2對象。

class MyClass {
  public each<T extends MyClass>(callback: (item: T) => void): MyClass {
    /* Loop through an array and apply the callback */
    return this;
  }
}

class MyClass2 extends MyClass {
  public before(html: string): MyClass2 {
    return <MyClass2>this.each(item => { /* Do Some Stuff */ });
  }
}

檢查，看它是否transpiles並返回的實例MyClass2 ：

let myclass2 = new MyClass2();
console.log(myclass2.before('') instanceof MyClass2); // returns true

Answer 4

您嘗試做的事情稱為向下轉換：您的函數返回一個T，它是MyClass的子類，但您的實際返回類型是MyClass，它是T的超類。

通過繼承進行的多態操作通常使您可以向上（而不是向下）進行操作，因為子類型通常較寬（更多字段），並且最終使用的對象不具有您期望的所有屬性。

我對打字稿不是很熟悉，但是我發現您可以像這樣return <MyClass>this;進行打字，讓它飛起來return <MyClass>this; 它應該可以工作，但是由於上述原因，通常被認為是不好的做法。

有關打字稿中轉型的詳細信息，請參閱http://blogs.microsoft.co/il/gilf/2013/01/18/using-casting-in-typescript/ 。