使用TypeScript通用接口

Question

我有幾種類型的對象，例如文章，部門，個人資料等。我基本上為每個對象定義了一個接口：

interface IArticle {
    title: string;
    body: string;
}

interface IProfile {
    name: string;
    email: string;
}

interface IDivision {
    name: string;
    leader: IProfile;
}

現在，在某些情況下，我希望能夠在顯示表單的頁面上使用formTitle屬性。 我以為我可以做這樣的事情：

// Failed
interface IForm<T> {
    formTitle: string;
}

function formDisplay(resource: IForm<IProfile>) { }

但是，當我這樣做時，我得到一個錯誤，指示類型IForm<IProfile>上不存在對象屬性（在這種情況下， name和email ）。 所以我想這不是正確使用泛型。 來自Ruby和JavaScript，我對整個靜態打字還是陌生的。

為了解決這個問題，我一直在為每個對象編寫單獨的接口，如下所示：

// Not reusable
interface IArticleForm extends IArticle {
    formTitle: string;
}

我想到的另一種選擇是向基本接口添加一個可選屬性，然后從那里擴展常規對象接口。

// Does not provide helpful type checking
interface IBase {
    formTitle?: string;
}
interface IArticle extends IBase { }

但是我希望這些表單頁面上需要formTitle ，這樣我就不會忘記對其進行設置。 是否有某種方法可以以可重用的方式將一組必需的屬性應用於多個對象？

Answer 1

看起來您在尋找相交類型。 這使您可以將各種行為混合在一起。 您甚至可以為新創建的類型加上別名，以為其提供方便的名稱來描述其用法。

作為示例，請使用：

interface IProfile {
    name: string;
    email: string;
}
interface IForm {
    formTitle: string;
}
type IProfileForm = IForm & IProfile;

function formDisplay(resource: IProfileForm) { }

Answer 2

泛型旨在“包含”任何泛型類型-您需要在IForm中具有泛型類型的字段：

interface IMyContent {}

interface IProfile extends IMyContent {
    name: string;
    email: string;
}

interface IForm<T extends IMyContent> {
    formTitle: string;
    content: T;
}

var x : IForm<IProfile> = {
    formTitle: "",
    content: {name: "", email: ""}
}