mosya<TC> - オブジェクトにキーとバリューを追加する型を作ろうの解説

この記事はmosya<TC>の問題の一つであるAppendToObject型の解説になります。

問題

インターフェースに新しいフィールドを追加する型を実装します。この型は、3 つの引数を受け取り、新しいフィールドを持つオブジェクトを出力しなければなりません。

例えば、以下のようなコードを満たすように実装しましょう。

type Test = { id: "1" };
type Result = AppendToObject<
  Test,
  "value",
  4
>; // expected to be { id: '1', value: 4 }

解答例

type AppendToObject<
  T extends {},
  U extends string,
  V
> = {
  [k in keyof T | U]: k extends keyof T
    ? T[k]
    : V;
};

1. T extends {}という条件を指定し、Tがオブジェクト型であることを制約します。
2. Uは、追加するフィールドの名前なので、U extends stringという条件を指定し、Uはstring型に制約します。
3. Vは、追加するフィールドの値なので、Vはそのまま返すので、制約はありません。
4. [k in keyof T | U]という型を指定し、TのフィールドとUを合わせたフィールドをオブジェクトのフィールドとして指定します。
5. k extends keyof T ? T[k] : Vという条件を指定し、kがTのフィールドにある場合は、そのフィールドの値を返し、そうでない場合は、Vを返します。