Ustaw wszystkie właściwości w interfejsie Typescript jako opcjonalne

Mam interfejs w mojej aplikacji:

interface Asset {
  id: string;
  internal_id: string;
  usage: number;
}

to jest część interfejsu posta:

interface Post {
  asset: Asset;
}

Mam również interfejs przeznaczony do wersji roboczej, w którym obiekt aktywów może być tylko częściowo zbudowany

interface PostDraft {
  asset: Asset;
}

Chcę zezwolić PostDraftobiektowi na posiadanie częściowego obiektu aktywów, jednocześnie sprawdzając typy właściwości, które tam są (więc nie chcę go po prostu zamieniać any).

Zasadniczo chcę mieć możliwość generowania następujących elementów:

interface AssetDraft {
  id?: string;
  internal_id?: string;
  usage?: number;
}

bez całkowitego ponownego definiowania Assetinterfejsu. Czy jest na to sposób? Jeśli nie, jaki byłby mądry sposób ułożenia moich typów w tej sytuacji?

Nie jest to możliwe w TypeScript <2.1 bez tworzenia dodatkowego interfejsu z opcjonalnymi właściwościami; jest to jednak możliwe przy użyciu mapowanych typów w języku TypeScript 2.1+.

Aby to zrobić, użyj Partial<T>typu, który domyślnie udostępnia TypeScript.

interface PostDraft {
    asset: Partial<Asset>;
}

Teraz wszystkie włączone właściwości assetsą opcjonalne, co pozwoli ci wykonać następujące czynności:

const postDraft: PostDraft = {
    asset: {
        id: "some-id"
    }
};

O Partial<T>

Partial<T>jest zdefiniowany jako typ mapowany, co powoduje, że każda właściwość w podanym typie jest opcjonalna (przy użyciu ?tokenu).

type Partial<T> = {
    [P in keyof T]?: T[P];
};

Przeczytaj więcej o mapowanych typach tutaj oraz w podręczniku .

Głębokie Częściowe

Jeśli potrzebujesz częściowej implementacji, która działa rekurencyjnie na obiektach, możesz użyć następującego typu w TS 4.1+:

type DeepPartial<T> = {
    [P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P];
};

Właściwości w interfejsie są opcjonalne albo nie, nie można użyć tego samego interfejsu raz jako opcjonalnego i raz w razie potrzeby.

Co możesz zrobić, to mieć interfejs z opcjonalnymi właściwościami dla AssetDraftklasy, a następnie klasę z obowiązkowymi właściwościami dla Asset:

interface AssetDraft {
    id?: string;
    internal_id?: string;
    usage?: number;
}

class Asset {
    static DEFAULT_ID = "id";
    static DEFAULT_INTERNAL_ID = "internalid";
    static DEFAULT_USAGE = 0;

    id: string;
    internal_id: string;
    usage: number;

    constructor(draft: AssetDraft) {
        this.id = draft.id || Asset.DEFAULT_ID;
        this.internal_id = draft.internal_id || Asset.DEFAULT_INTERNAL_ID;
        this.usage = draft.usage || Asset.DEFAULT_USAGE;
    }
}

Domyślne wartości tutaj to statyczne elementy członkowskie, ale możesz je uzyskać w inny sposób lub zgłosić błąd, jeśli ich brakuje.

Uważam, że ten sposób jest bardzo wygodny podczas pracy z jsonami otrzymanymi z serwera (lub czymś podobnym), interfejsy reprezentują dane json, a klasy są rzeczywistymi modelami, które są konstruowane przy użyciu jsonów jako wartości początkowych.

Jeśli chcę mieć wyraźny AssetDraftinterfejs, użyłbym kombinacji extendsi Partial:

interface Asset {
  id: string;
  internal_id: string;
  usage: number;
}

interface AssetDraft extends Partial<Asset> {}

Oprócz Davida Sherreta odpowiedz tylko w kilku wierszach z mojej strony, jak można to zaimplementować bezpośrednio bez Partial<T>pisania, aby lepiej zrozumieć temat.

interface IAsset {
  id: string;
  internal_id: string;
  usage: number;
}

interface IPost {
  asset: IAsset;
}

interface IPostDraft {
  asset: { [K in keyof IAsset]?: IAsset[K] };
}

const postDraft: IPostDraft = {
  asset: {
    usage: 123
  }
};

Co powiesz na wymuszone rzucenie pustego przedmiotu np

const draft = <PostDraft>{}
draft.id = 123
draft.internal_id = 456
draft.usage = 789

Jeśli naprawdę tego potrzebujesz, zawsze możesz wygenerować interfejs d.ts z szablonu, który zawiera zarówno opcjonalne, jak i wpisane właściwości.

Jak zauważył Nitzan, albo właściwości interfejsu Typescript są opcjonalne, albo nie