タイプのネストされたプロパティを変更するにはどうすればよいですか?

アサフアビブ

私はタイプを持っています

type Foo = {
  a: {
    b: {
      c: string[]
      ...rest
    }
    ...rest
  }
  ...rest
}

a.b.c別のタイプに変更し、残りのプロパティを保持するにはどうすればよいですか?

jcalz

TypeScriptはこれを行うための組み込みの方法を提供しないため、そのようなものが必要な場合は、マップされた条件付きタイプを使用して自分でビルドする必要があります。また、特にオプション/読み取り専用/ etcプロパティと関数/配列では、あらゆる種類の潜在的なエッジケースがあるため、必要な動作を正確に考慮する必要があります。

これを行う1つの方法は次のとおりです。

type _Overwrite<T, U> = U extends object ? (
    { [K in keyof T]: K extends keyof U ? _Overwrite<T[K], U[K]> : T[K] } & U
) : U

type ExpandRecursively<T> = T extends Function ? T : T extends object
    ? T extends infer O ? { [K in keyof O]: ExpandRecursively<O[K]> } : never
    : T;

type Overwrite<T, U> = ExpandRecursively<_Overwrite<T, U>>

タイプは、_Overwrite<T, U>型を取るTUしてからものを置き換える、そのプロパティを再帰的に歩くTからのものとのU競合がある場合。このタイプは機能するはずですが、交差点使用して表現するため、醜くなる可能性があります。

だから、ExpandRecursively<T>一緒にすべてのプロパティ結果の型およびマージをウォークスルータイプがあり、そう{a: string} & {b: number}なるはず{a: string, b: number}

そして、結果Overwrite<T, U>を取り入れ_Overwrite<T, U>て使用ExpandRecursively<>しているだけです。


例を使ってどのように動作するかを見てみましょう。

type Foo = {
    a: {
        b: {
            c: string[];
            d: number;
        }
        e: {
            f: boolean;
        }
    };
    g: {
        h?: () => string;
    }
}

type ReplaceFoo = Overwrite<Foo, { a: { b: { c: number } } }>;

これにより、次のようになります。

/*
type ReplaceFoo = {
    a: {
        b: {
            c: number;
            d: number;
        };
        e: {
            f: boolean;
        };
    };
    g: {
        h?: (() => string) | undefined;
    };
}
*/

これは私には合理的に見えます。しかし、使用する前に、このようなものを非常に徹底的にテストするT必要Uがあります共用体タイプである場合、および/または共用体タイプである場合はどうますか?配列またはタプルの場合、TまたはそれUである場合どうしますか?「置き換えあなたは間の区別を行うことができるようにしたいかし、」置き換え「」?(つまり、サブプロパティを「置換」する代わりに「消去」するオプションが必要ですか?)これらの質問(およびおそらく他の質問)に対するすべての回答は、どのように記述したいかに関係しますa.b.cnumbera.b{c: number}Overwrite<T, U>

それがあなたに前進する方法のいくつかのアイデアを与えることを願っています。幸運を!

コードへの遊び場リンク

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

Stateのネストされたオブジェクトのプロパティを変更するにはどうすればよいですか?

分類Dev

ネストされたプロパティが表示されるDataGridViewComboboxColumnで1つのComboBoxを無効にするにはどうすればよいですか?

分類Dev

設計時にカスタムプロパティが変更されたときにContentControlUIを更新するにはどうすればよいですか?

分類Dev

オブジェクト内のネストされたプロパティのキーパスを取得するにはどうすればよいですか?

分類Dev

ネストされたプロパティでAngularJSフィルターを作成するにはどうすればよいですか?

分類Dev

SQL ServerデータベースプロジェクトでFKのプロパティを変更するにはどうすればよいですか?

分類Dev

モーダルポップアップの位置CSSスタイルプロパティを変更するにはどうすればよいですか?

分類Dev

Visioのコネクタツールのデフォルトのプロパティを変更するにはどうすればよいですか?

分類Dev

Visioのコネクタツールのデフォルトのプロパティを変更するにはどうすればよいですか?

分類Dev

配列アイテムのネストされたプロパティのマップされたタイプを取得するにはどうすればよいですか?

分類Dev

疑似クラスのプロパティを変更するにはどうすればよいですか?

分類Dev

バケットのプロパティを変更するにはどうすればよいですか

分類Dev

オブジェクトのプロパティタイプを動的に変更するにはどうすればよいですか?

分類Dev

Groovyのオブジェクトからネストされたプロパティ値を取得するにはどうすればよいですか?

分類Dev

配列内のプロパティでネストされたオブジェクトをクエリするにはどうすればよいですか?

分類Dev

このコンポーネントに渡されたプロパティに従ってコンポーネントのデータを変更するにはどうすればよいですか

分類Dev

イベントをトリガーした要素を渡し、そのプロパティを変更するにはどうすればよいですか?

分類Dev

ホバー時にボタンのスタイルプロパティを変更するにはどうすればよいですか?

分類Dev

ネストされた配列のリーフノードにプロパティを挿入するにはどうすればよいですか?

分類Dev

ネストされたプロパティでmapboxの「case」式を使用するにはどうすればよいですか?

分類Dev

Reactで深くネストされたプロパティの状態を設定するにはどうすればよいですか?

分類Dev

スタート画面のショートカットのプロパティを変更するにはどうすればよいですか?

分類Dev

ディスプレイのフロントパネルではなく、ソフトウェア/オペレーティングシステムによってディスプレイ出力を変更するにはどうすればよいですか?

分類Dev

トークンがlocalStorageに登録されているかどうかを監視し、それに応じてバインドされたプロパティの値を変更するにはどうすればよいですか?

分類Dev

ネストされたプロパティでオブジェクトスプレッドを使用するにはどうすればよいですか?

分類Dev

ミックスパネルのタイムイベントをプロパティで追跡するにはどうすればよいですか?

分類Dev

入力テキストが変更されたときにvue.jsでコンポーネントのプロパティを使用するにはどうすればよいですか?

分類Dev

クラスプロパティのタイプを宣言するにはどうすればよいですか?

分類Dev

Reactコンポーネントに提供されたプロパティがImmutable.jsRecord with Flowのインスタンスであるかどうかを確認するにはどうすればよいですか?

Related 関連記事

  1. 1

    Stateのネストされたオブジェクトのプロパティを変更するにはどうすればよいですか?

  2. 2

    ネストされたプロパティが表示されるDataGridViewComboboxColumnで1つのComboBoxを無効にするにはどうすればよいですか?

  3. 3

    設計時にカスタムプロパティが変更されたときにContentControlUIを更新するにはどうすればよいですか?

  4. 4

    オブジェクト内のネストされたプロパティのキーパスを取得するにはどうすればよいですか?

  5. 5

    ネストされたプロパティでAngularJSフィルターを作成するにはどうすればよいですか?

  6. 6

    SQL ServerデータベースプロジェクトでFKのプロパティを変更するにはどうすればよいですか?

  7. 7

    モーダルポップアップの位置CSSスタイルプロパティを変更するにはどうすればよいですか?

  8. 8

    Visioのコネクタツールのデフォルトのプロパティを変更するにはどうすればよいですか?

  9. 9

    Visioのコネクタツールのデフォルトのプロパティを変更するにはどうすればよいですか?

  10. 10

    配列アイテムのネストされたプロパティのマップされたタイプを取得するにはどうすればよいですか?

  11. 11

    疑似クラスのプロパティを変更するにはどうすればよいですか?

  12. 12

    バケットのプロパティを変更するにはどうすればよいですか

  13. 13

    オブジェクトのプロパティタイプを動的に変更するにはどうすればよいですか?

  14. 14

    Groovyのオブジェクトからネストされたプロパティ値を取得するにはどうすればよいですか?

  15. 15

    配列内のプロパティでネストされたオブジェクトをクエリするにはどうすればよいですか?

  16. 16

    このコンポーネントに渡されたプロパティに従ってコンポーネントのデータを変更するにはどうすればよいですか

  17. 17

    イベントをトリガーした要素を渡し、そのプロパティを変更するにはどうすればよいですか?

  18. 18

    ホバー時にボタンのスタイルプロパティを変更するにはどうすればよいですか?

  19. 19

    ネストされた配列のリーフノードにプロパティを挿入するにはどうすればよいですか?

  20. 20

    ネストされたプロパティでmapboxの「case」式を使用するにはどうすればよいですか?

  21. 21

    Reactで深くネストされたプロパティの状態を設定するにはどうすればよいですか?

  22. 22

    スタート画面のショートカットのプロパティを変更するにはどうすればよいですか?

  23. 23

    ディスプレイのフロントパネルではなく、ソフトウェア/オペレーティングシステムによってディスプレイ出力を変更するにはどうすればよいですか?

  24. 24

    トークンがlocalStorageに登録されているかどうかを監視し、それに応じてバインドされたプロパティの値を変更するにはどうすればよいですか?

  25. 25

    ネストされたプロパティでオブジェクトスプレッドを使用するにはどうすればよいですか?

  26. 26

    ミックスパネルのタイムイベントをプロパティで追跡するにはどうすればよいですか?

  27. 27

    入力テキストが変更されたときにvue.jsでコンポーネントのプロパティを使用するにはどうすればよいですか?

  28. 28

    クラスプロパティのタイプを宣言するにはどうすればよいですか?

  29. 29

    Reactコンポーネントに提供されたプロパティがImmutable.jsRecord with Flowのインスタンスであるかどうかを確認するにはどうすればよいですか?

ホットタグ

アーカイブ