はじめに

このスクラップではTypeScriptの型について豊富な問題を備えているType<Challenge>[]を毎日3つずつ解いて投稿していきます。
はじめの18日分はQiitaに投稿していたものを削除してこちらに移行しています。

1日目

【入門】Hello World

問題の詳細はこちらです。

問題

以下のコートを変形して

// expected to be string
type HelloWorld = any

以下のテストを通るようにしなさい。

// you should make this work
type test = Expect<Equal<HelloWorld, string>>

解答

type HelloWorld = string

解説

入門なので何の捻りもない問題でした。HelloWorldの型がanyではなく、stringになれば良いのでその部分を置換しました。
ちなみに問題のテストで使われているEqualですが、第一引数と第二引数に渡された方を比較して正しければtrue間違えていればfalseを返す型となっています。

type Equal<X, Y> = (<T>() => T extends X ? 1 : 2) extends <T>() => T extends Y ? 1 : 2 ? true : false

複雑かつ難解でわかりにくいですが、こちらの記事がEqualについてとても分かりやすかったです。
Equalはtrueのみを許容する型です。

type Expect<T extends true> = T

【初級】Pick

問題の詳細はこちらです。

問題

組み込みの型ユーティリティPick<T, K>を使用せず、TからKのプロパティを抽出する型を実装します。

例えば：

interface Todo {
  title: string
  description: string
  completed: boolean
}

type TodoPreview = MyPick<Todo, 'title' | 'completed'>

const todo: TodoPreview = {
    title: 'Clean room',
    completed: false,
}

解答

type MyPick<T, K extends keyof T> = { [k in K]: T[k] }

解説

先ほどの問題に比べると難易度は一段階どころじゃないくらい上がったと思います。Mapped Typesを知らなければ解けない気がしますが、基本的な形であるので(知っておくべきだし)まさに初級と感じました。
型引数で第一引数にT、そして第二引数にはTのkeyの一部となるようなKを取るように設定しました。つまりKはTのキーで作られたユニオン型となっています(単体の時もありますが)。そしてKから一つ一つキーとなる値を取ってきてそれに対応するTのプロパティのみを取得しています。

私の解答ではk in Kとしてますが、他の方の回答を見るとkの部分をPで書かれているものが多かったです。さらに実際のtsの実装でも

type Pick<T, K extends keyof T> = {
    [P in K]: T[P];
};

となっていました。Kの一部ということでpartから取ってきているのかなと考えられます。今後はこの部分はPで回答したいと思いました。

【初級】Readonly

問題の詳細はこちらです。

問題

組み込みの型ユーティリティReadonly<T>を使用せず、T のすべてのプロパティを読み取り専用にする型を実装します。実装された型のプロパティは再割り当てできません。

例えば：

interface Todo {
  title: string
  description: string
}

const todo: MyReadonly<Todo> = {
  title: "Hey",
  description: "foobar"
}

todo.title = "Hello" // Error: cannot reassign a readonly property
todo.description = "barFoo" // Error: cannot reassign a readonly property

解答

type MyReadonly<T> = { readonly [P in keyof T]: T[P] };

解説

Mapped Typesを知っているもしくは、先ほどの問題が解いたことがあれば容易な問題だったのではないでしょうか(readonlyを知ってれば)。Tを再生成する場合は

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

のように書きますが、今回はreadonlyにしなければならないので、生成時に一手間加えました。改行の差分はありますが、tsの実装でも同様の実装方法となっています。

2日目

【初級】Tuple to Object

問題の詳細はこちらです。

問題

タプルを受け取り、その各値のkey/valueを持つオブジェクトの型に変換する型を実装します。

例えば：

const tuple = ['tesla', 'model 3', 'model X', 'model Y'] as const

type result = TupleToObject<typeof tuple> // expected { tesla: 'tesla', 'model 3': 'model 3', 'model X': 'model X', 'mode

解答

type TupleToObject<T extends readonly any[]> = { [P in T[number]]: P }`

解説

２問目、３問目で利用した、Mapped Typesとタプルの扱いが重要となる問題でした。
タプル型TをT[number]のように表現すると中身のユニオン型を得られるのでそれを活かした問題でした。
ちなみにですが、他の方の回答を見てみると前回P in Tの形ではPを使っていることが多いので今後はPを使うという話をしましたが、ここではP以外も多く使われてました(K、valueやkeyなど)。
例

type T = [number, string, boolean];
type U = T[number]; // number | string | boolean

解答を試すPlaygroundではTupleToObjectの引数は初めから入力されていました。そのため触れてきませんでしたが、引数の部分に注目してみるとT extends readonly any[]となっています。Playgroundのテストでは型がreadonlyのタプルなのでreadonlyにしなければ通らないのですが、もしreadonlyでなかったとしても配列やタプルを扱う場合は極力readonlyにした方が良いです。そうすることで型に対するドキュメント性の向上や、安全性が高まります。

【初級】First of Array

問題の詳細はこちらです。

問題

配列Tを受け取り、その最初のプロパティの型を返すFirst<T>を実装します。

例えば：

type arr1 = ['a', 'b', 'c']
type arr2 = [3, 2, 1]

type head1 = First<arr1> // expected to be 'a'
type head2 = First<arr2> // expected to be 3

解答

type First<T extends any[]> = T extends [infer U, ...any] ? U : never;

解説

これまでとは毛色が異なる問題でした。他の方の解答に以下のようなものがあり、私の解答はスマートではないことに気づきました。

type First<T extends any[]> = T extends [] ? never : T[0];

空配列でなければ、先頭を返すというものです。
私の解答は応用が効くという点で紹介します。ここではinferを用いて型推論をおこなっています。Tが配列で、最初に型推論が可能なUがあればUを返してUがなければneverを返すようになっています。Firstは配列しか受け取れませんので、最初の値がないものは空配列として、最初の値Uを推論して返すことができるわけです。

【初級】Length of Tuple

問題の詳細はこちらです。

問題

タプルTを受け取り、そのタプルの長さを返す型Length<T>を実装します。

例えば：

type tesla = ['tesla', 'model 3', 'model X', 'model Y']
type spaceX = ['FALCON 9', 'FALCON HEAVY', 'DRAGON', 'STARSHIP', 'HUMAN SPACEFLIGHT']

type teslaLength = Length<tesla>  // expected 4
type spaceXLength = Length<spaceX> // expected 5

解答

type Length<T extends readonly any[]> = T extends { length: infer U } ? U : never;

解説

他の解答を見るとまた簡単な解答がありまして、

type Length<T extends readonly any[]> = T['length'];

で良いそうです。私の解答はinferでlengthにアクセスして取得したやり方です。

3日目

【初級】Exclude

問題の詳細はこちらです。

問題

組み込みの型ユーティリティExclude <T, U>を使用せず、Uに割り当て可能な型をTから除外する型を実装します。

例えば：

type Result = MyExclude<'a' | 'b' | 'c', 'a'> // 'b' | 'c'

解答

type MyExclude<T, U> =  T extends U ? never : T;

解説

これは挙動を知っているかのクイズですね。
TにUが含まれていたときのみ、neverを返すようにすることで、Uを除いたTが返るようになります。tsの本家の実装も同じようになっています。

【初級】Awaited

問題の詳細はこちらです。

問題

Promise ライクな型が内包する型をどのように取得すればよいでしょうか。

例えば：Promise<ExampleType>という型がある場合、どのようにして ExampleType を取得すればよいでしょうか。

type ExampleType = Promise<string>

type Result = MyAwaited<ExampleType> // string

解答

type MyAwaited<T> = T extends Promise<infer U> ? MyAwaited<U> : T;

解説

アルゴリズム的な要素が顔を出してきて、面白くなってきました。
Promiseが剥がれるまでPromiseが内包する型の推論を行いました。inferを使った推論を再起的に行って解答を得ています。
他者の解答を見てみると以下のようなものが見受けられました。

type MyAwaited<T> = T extends Promise<infer P> ? P extends Promise<unknown> ? MyAwaited<P> : P : never

このケースではTにPromiseを渡さなかった場合はneverを返すようになります(前者はそのままTを返します)。最初のTの検査でPromiseでなければneverが返されるからです。次にPの中身を見てPromiseであればMyAwaitedに渡して再起的に検査、PromiseでなければPを返しています。
挙動の違いは前者はPromiseでなかった場合は再起先で値を返し、後者はPromiseでなかった場合はすぐに中身を返して再起させないという違いから生まれています。テストケースにはPromiseがないものが含まれていないのでどちらも解答として問題ないと考えています。。
tsではAwaitedとして以下のように実装されています。

type Awaited<T> =
    T extends null | undefined ? T :
        T extends object & { then(onfulfilled: infer F): any } ?
            F extends ((value: infer V, ...args: any) => any) ?
                Awaited<V> :
                never :
        T;

Awaitedの解説は長くなるので別で書こうと思います。どちらにせよ、tsによって実装されたAwaitedはPromiseでない型に対してそのまま型を返すので私と同様の解答が本家に近いと考えられます。

【初級】If

問題の詳細はこちらです。

問題

条件値C、 Cが truthy である場合の戻り値の型T、Cが falsy である場合の戻り値の型Fを受け取るIfを実装します。 条件値C はtrueかfalseのどちらかであることが期待されますが、T と F は任意の型をとることができます。

例えば：

type A = If<true, 'a', 'b'>; // expected to be 'a'
type B = If<false, 'a', 'b'>; // expected to be 'b'

解答

type If<C extends boolean, T, F> = C extends true ? T : F;

解説

先ほどまでと比べるととても基本的で簡単な問題が出てきました。Cの方をチェックして、TとFで出し分けるようにしています。

4日目

【初級】Concat

問題の詳細はこちらです。

問題

JavaScript のArray.concat関数を型システムに実装します。この型は 2 つの引数を受け取り、受け取ったイテレータの要素を順に含む新しい配列を返します。

例えば：

type Result = Concat<[1], [2]>; // expected to be [1, 2]

解答

type Concat<T extends readonly any[], U extends readonly any[]> = [...T, ...U];

解説

配列において、スプレッド構文はtsでも有効ですから配列同様に書くことができます。そのため解答のようにシンプルに書くことができます。この問題では配列しか渡されないとして、引数で配列であることを検査しています。

【初級】Includes

問題の詳細はこちらです。

問題

JavaScriptのArray.include関数を型システムに実装します。この型は、2 つの引数を受け取り、trueやfalseを出力しなければなりません。

例えば：

type isPillarMen = Includes<['Kars', 'Esidisi', 'Wamuu', 'Santana'], 'Dio'> // expected to be `false`

解答

type Includes<T extends readonly any[], U> = T extends [infer V, ...infer W]
  ? Equal<V, U> extends true
    ? true
    : Includes<W, U>
  : false;

解説

最初に考えた形では動きませんでしたし、これまでの問題の中では一番難しく感じました。下のように解いたところ、

type Includes<T extends readonly any[], U> = U extends T[number] ? true : false;

下のテストケースでは通りませんでした。

Expect<Equal<Includes<[{}], { a: 'A' }>, false>>,

T[number]がUの一部であることだけを確認しているので、UがTに含まれていることが保証されていませんでした。つまりTの一部がUと完全に一致する必要がありました。
それを解決するために、Tの最初の値から順番に取って一致しているか比較して検査するようにしました。完全一致していることの実装は大変なのでテストで使っているものを拝借して行いました。以下のようなフローで解答を得ています。

• Tの中身が存在することを確認する
  • 存在すればTを最初の値と残りの配列で分け、最初の値がUと完全一致するか確かめる
    • 一致したらtrueを返す
    • 一致しなければ残りの配列をTとして最初から行う
  • 存在しなければfalseを返す

【初級】Push

問題の詳細はこちらです。

問題

Array.pushのジェネリックバージョンを実装します。

例えば：

type Result = Push<[1, 2], '3'> // [1, 2, '3']

解答

type Push<T extends readonly any[], U> = [...T, U];

解説

concatのUが値バージョンですね。Uをそのまま追加するので展開する必要はありません(できません)。Includesの難しさが際立ちます。
ちなみにですが、よく使う似たような型として以下のものがあります。

type NotEmptyArray<T> = [T, ...T[]]

形が似ているだけで、意味は全く違います。これは長さが1以上の中身の型がTである配列を表しています。最初にTがあることで0個の時に型エラーが起きるようになっています。先ほどの例でUを含むような配列にしたのと同様でこれはTを含むような配列を定義したからです。表現として知っているとどこかで使えると思います。

5日目

【初級】Unshift

問題の詳細はこちらです。

問題

Array.unshiftの型バージョンを実装します。

例えば：

type Result = Unshift<[1, 2], 0> // [0, 1, 2,]`

解答

type Unshift<T extends readonly any[], U> = [U, ...T];

解説

初級の問題もあと２問ですが、これまで解いてきて同難易度とされているものであっても難易度にかなり差があると感じました。
今回はその中で簡単に感じたものの一つです。前回と前後が逆になったもので、配列の最初にUを入れて後ろにTを展開しました。

【初級】Parameters

問題の詳細はこちらです。

問題

組み込みの型ユーティリティParameters<T>を使用せず、Tからタプル型を構築する型を実装します。

例えば：

const foo = (arg1: string, arg2: number): void => {}

type FunctionParamsType = MyParameters<typeof foo> // [arg1: string, arg2: number]

解答

type MyParameters<T extends (...args: any[]) => any> = T extends (...args: infer V) => any ? V : never;

解説

型推論でパラメータの型を取ってきて、それを返しています。この型に当てはまらない場合は関数ではないのでneverを返してます(その場合はそもそも受け取れないのでエラーになるが)。

【中級】Get Return Type

問題の詳細はこちらです。

問題

組み込みの型ユーティリティReturnType<T>を使用せず、Tの戻り値の型を取得する型を実装します。

例えば

const fn = (v: boolean) => {
  if (v)
    return 1
  else
    return 2
}

type a = MyReturnType<typeof fn> // should be "1 | 2"

解答

type MyReturnType<T> = T extends (...args: any) => infer U ? U : never;

解説

初の中級問題でした。ただ、内容は初級と何が違うかわかりませんでした(引数にextendsがないくらい？)。
一つ前の問題では、パラメータを推論して結果を返してましたが、この問題では返り値を推論して返すようにしています。
私の解答では関数以外の推論でもエラーにならないので引数にFunctionを追加して

type MyReturnType<T extends Function> = T extends (...args: any) => infer U ? U : never;

のようにしても良いかもしれません。

6日目

【中級】Omit

問題の詳細はこちらです。

問題

組み込みの型ユーティリティOmit<T, K>を使用せず、TのプロパティからKを削除する型を実装します。

例えば

interface Todo {
  title: string
  description: string
  completed: boolean
}

type TodoPreview = MyOmit<Todo, 'description' | 'title'>

const todo: TodoPreview = {
  completed: false,
}

解答

type MyOmit<T, K extends keyof T> = { [P in Exclude<keyof T, K>]: T[P] };

解説

Excludeは既に実装済みなのでそれを用いて行いました。行なっていることはただのMapped Typesのkeyに制約を加えただけです。Exclude(外部に定義した型)を使わなければPの操作(除外や追加など)ができないため、操作する前に絞り出しました。tsでの実装もこのようになっています。
他の解答を除いてみたら以下のような解答がありました。

type MyOmit<T, K extends keyof T> = {
  [Key in keyof T as Key extends K ? never : Key]: T[Key]
};

Keyをas以降で再マッピングして行う方法です。これを用いれば確かに、外部に型を作る必要なく解答することができます。この機能はts4.1からのようなので以前のバージョンを使用する方は注意してください。

【中級】readonly

問題の詳細はこちらです。

問題

2つの型引数TとKを取るMyReadonly2<T, K>を実装します。

Kが指定されている場合は、Tの中のKのプロパティのみを読み取り専用にします。Kが指定されていない場合は、通常のReadonly<T>と同様に、すべてのプロパティを読み取り専用にします。

例えば

interface Todo {
  title: string
  description: string
  completed: boolean
}

const todo: MyReadonly2<Todo, 'title' | 'description'> = {
  title: "Hey",
  description: "foobar",
  completed: false,
}

todo.title = "Hello" // Error: cannot reassign a readonly property
todo.description = "barFoo" // Error: cannot reassign a readonly property
todo.completed = true // OK

解答

type MyReadonly2<T, K extends keyof T = keyof T> = {
  readonly [P in keyof T] : T[P]
} & Omit<T,K>

解説

初めて自力では解けませんでした。難易度が上がったというよりかは知識不足ゆえだったと考えています。
前回の問題のように

type MyOmit<T, K extends keyof T> = {
  [Key in keyof T as Key extends K ? readonly Key : Key]: T[Key]
};

と書けばできると考えていましたが、できませんでした。それもそのはずで、readonlyは[]の前に書く必要があるからです。
解答には他者の解答を貼りました。まずMapped Typesによって全ての中身がreadonlyなオブジェクトを作成します。そして今回readonlyにしない要素を取り出してそれとIntersection Typesを取ります。これらは同様のkeyとobjectがあったとき、片方がreadonlyそしてもう片方がreadonlyでなかったときreadonlyがないkeyとvalueとして型が生成されるのを活かしています。
問題に使った例を見て動きを確認してみます。

{ readonly [P in keyof T]: T[P] }

これをTodoに適当すると

type ReadonlyTodo = {
  readonly title: string;
  readonly description: string;
  readonly completed: boolean;
};

となります。次に

Omit<T, K>

をTodoに適応すると

type OmitTodo = {
  completed: boolean;
};

となります。この二つでIntersection Typesをとるので、title、descriptionはReadonlyTodoのまま、completedはOmitTodoに負けて、

type Todo = {
  readonly title: string;
  readonly description: string;
  completed: boolean;
};

になります。もし、completedが元からreadonlyの場合はReadonlyTodoと同じ型になるので、元にreadonlyが含まれていても問題なく動作します。

【中級】Deep Readonly

問題の詳細はこちらです。

問題

オブジェクトのすべてのパラメーター（およびそのサブオブジェクトを再帰的に）を読み取り専用にするDeepReadonly<T>を実装します。

この課題ではオブジェクトのみを扱っていると想定してください。配列、関数、クラスなどは考慮する必要はありません。しかし、可能な限り様々なケースをカバーすることで、自分自身に挑戦することができます。

例えば

type X = { 
  x: { 
    a: 1
    b: 'hi'
  }
  y: 'hey'
}

type Expected = { 
  readonly x: { 
    readonly a: 1
    readonly b: 'hi'
  }
  readonly y: 'hey' 
}

type Todo = DeepReadonly<X> // should be same as `Expected`

解答

type DeepReadonly<T> = {
  readonly [Key in keyof T]: T[Key] extends
    object
      ? T[Key] extends Function
       ? T[Key]
       : DeepReadonly<T[Key]>
      : T[Key]
};

解説

Mapped Typeの派生です。readonlyを付与できなくなるまで再起的に呼び出すような仕組みになっています。
keyはreadonlyに変換する部分以外は通常と何も変わりません。valueはobjectであれば、readonlyにするためにDeepReadonlyに突っ込んで、そうでなければそのまま返すようにしています。ここで一つ注意が必要です。objectはプリミティブ以外を指すので、関数や配列もobjectになります。そのためreadonlyにできない関数の場合はそのまま返すようにしています。そして、今回のテストケースでは問題になりませんでしたが、objectは関数や配列だけでなく正規表現なども含みます。そのためこれをアプリの開発環境で振り回すのは避けるべきだと考えられます。

7日目

【中級】Tuple of Union

問題の詳細はこちらです。

問題

タプルの値からユニオン型を生成するTupleToUnion<T>を実装します。

例えば

type Arr = ['1', '2', '3']

type Test = TupleToUnion<Arr> // expected to be '1' | '2' | '3'

解答

type TupleToUnion<T extends any[]> = T extends [infer U, ...infer V] ? U | TupleToUnion<V> : never;

解説

解答後に複雑なことをしていることに気づきました。中級ですが、以下のように簡単に書くことができました。

type TupleToUnion<T extends any[]> = T[number];

解答に書いた方は、先頭から一つずつ再起的に取ってくるやり方です。

【中級】Chainable Options

問題の詳細はこちらです。

問題

JavaScript では、チェイン可能なオプションがよく使われます。しかし、TypeScript に切り替えたとき、正しく型を付けることができますか？

この課題では、オブジェクトでもクラスでも何でもいいので、 option(key, value) と get() の 2 つの関数を提供する型を定義してください。option では、与えられたキーと値を使って現在の config の型を拡張できます。最終的な結果は get で取得することにしましょう。

例えば

declare const config: Chainable

const result = config
  .option('foo', 123)
  .option('name', 'type-challenges')
  .option('bar', { value: 'Hello World' })
  .get()

// expect the type of result to be:
interface Result {
  foo: number
  name: string
  bar: {
    value: string
  }
}

この問題を解くために js/ts のロジックを書く必要はありません。型レベルのロジックだけを書いてください。

key は string のみを受け付け、value は任意の型を受け付けると仮定しても構いません。同じ key が 2 回渡されることはありません。

解答

type Chainable<T extends object = {}> = {
  option<K extends string, V>(
    key: K,
    value: V
  ): Chainable<{ [key in K]: V } & Omit<T, K>>;
  get(): T;
};

解説

問題や設定の多さからも読み取れるようにかなり難易度が上がったと思います。形式としてはoptionを呼び出すたびにオブジェクトを更新して行き、getが呼び出された時に最新状態のオブジェクトを返すようになっています。getで返す値はChainableの引数となるように書き、初期値は空のオブジェクトを渡しています。
optionの実装について説明します。optionはkeyとvalueをそれぞれKとVとして受け取ります。そしてoptionの返り値として、再度optionやgetを呼び出せるようにChainableを返しています。Chainableの中身はKをキー、VをバリューにするオブジェクトとChainalbeに渡されたTからKがkeyのものを消したものです。つまりKをkeyとする古い値が存在した場合それを削除して、新たに追加されたkeyに置き換えています。これによってこの中身が更新されたオブジェクトの型となり、次のChainableのgetで渡された値を返すだけで良くなります。

【中級】Last of Array

問題の詳細はこちらです。

問題

配列 T を受け取り、その最後の要素の型を返す汎用的な Last<T> を実装してください。

例えば

type arr1 = ['a', 'b', 'c']
type arr2 = [3, 2, 1]

type tail1 = Last<arr1> // expected to be 'c'
type tail2 = Last<arr2> // expected to be 1

解答

type Last<T extends any[]> =T extends [...any, infer U] ? U : never;

解説

先ほどの問題と比べると、随分簡単になりました。
配列の最後の値を推測して取ってきています。

8日目

【中級】Pop

問題の詳細はこちらです。

問題

配列 T を受け取り、最後の要素を除いた配列を返す汎用的な Pop<T> を実装してください。

例えば

type arr1 = ['a', 'b', 'c', 'd']
type arr2 = [3, 2, 1]

type re1 = Pop<arr1> // expected to be ['a', 'b', 'c']
type re2 = Pop<arr2> // expected to be [3, 2]

おまけ: 同様に Shift、 Push、 Unshift も実装できますか？

解答

type Pop<T extends any[]> = T extends [...infer U, any] ? U : [];

解説

実質4問出されました。今日は2倍解くことになりそうです。
配列の長さが1以上であれば最後を除いた配列を推論して返し、0であれば空配列を返すようにしています。
同様にShiftは

type Shift<T extends any[]> = T extends [any, ...infer U] ? U : never;

Pushは

type Push<T extends any[], U> = [...T, U];

Unshiftは

type Unshift<T extends any[], U> = [U, ...T];

【中級】Promise.all

問題の詳細はこちらです。

問題

Promise ライクなオブジェクトの配列を受け取る関数 PromiseAll に型を付けてください。戻り値は Promise<T> である必要があります。ここで、T は解決された結果の配列です。

const promise1 = Promise.resolve(3);
const promise2 = 42;
const promise3 = new Promise<string>((resolve, reject) => {
  setTimeout(resolve, 100, 'foo');
});

// expected to be `Promise<[number, 42, string]>`
const p = PromiseAll([promise1, promise2, promise3] as const)

解答

declare function PromiseAll<T extends any[]>(values: readonly [...T]): Promise<{[P in keyof T]: Awaited<T[P]>}>

解説

valuesに渡される引数とTのやりとりが難しく、手こずりました。
valuesに渡された配列からreadonlyを取ったものをTとして定義します。そしてPromiseAllの返り値としてTをPromiseで囲んで返します。これで多くの場合問題ありませんが、Tの一部にPromiseが含まれていた場合うまくいきません。そこでtsに実装されているAwaitedを用いることでPromiseが含まれていたとしてもその中身を出力できるようにしています。

【中級】Type Lookup

問題の詳細はこちらです。

問題

Union 型から特定の型を属性を使って取得したいことがあります。

この課題では、Cat | Dog という Union 型に共通する type というフィールドを使って、対応する型を取得します。つまり、以下の例のように、 LookUp<Dog | Cat, 'dog'> の場合は Dog を、LookUp<Dog | Cat, 'cat'> の場合は Cat を取得することになります。

interface Cat {
  type: 'cat'
  breeds: 'Abyssinian' | 'Shorthair' | 'Curl' | 'Bengal'
}

interface Dog {
  type: 'dog'
  breeds: 'Hound' | 'Brittany' | 'Bulldog' | 'Boxer'
  color: 'brown' | 'white' | 'black'
}

type MyDog = LookUp<Cat | Dog, 'dog'> // expected to be `Dog`

解答

type LookUp<U, T> = U extends { type: T } ? U : never;

解説

これまで解いてきた問題で一番、実用的な問題が出てきました。
Uがtypeをkeyとして、Tをバリューにする値を持っていた場合はUをそのまま返し、持っていなければneverを返しています。これによって絞り込みが可能となります。

9日目

【中級】Trim Left

問題の詳細はこちらです。

問題

文字列を受け取り、先頭の空白を削除した新しい文字列を返す TrimLeft<T> を実装します。

例えば

type trimed = TrimLeft<'  Hello World  '> // expected to be 'Hello World  '

解答

type Trash = ' ' | '\n' | '\t';
type TrimLeft<S extends string> = S extends `${Trash}${infer s}` ? TrimLeft<s> : S;

解説

まず、ゴミを定義します。ゴミとは空白とタブ文字列と改行文字列を指します。
そして、先頭にゴミがあったときはそれを除いて再起的に検査します。最終的に先頭にゴミがなくなったら受け取った文字列をそのまま返します。当たり前ですが、アプリなどの運用で使うときはTrashではなくWhiteSpaceなどの命名にすべきだと思います。

【中級】Trim

問題の詳細はこちらです。

問題

文字列を受け取り、両端の空白を削除した新しい文字列を返す Trim<T> を実装します。

例えば

type trimed = Trim<'  Hello World  '> // expected to be 'Hello World'

解答

type Trash = ' ' | '\n' | '\t';
type Trim<S extends string> = S extends `${Trash}${infer s}` ? Trim<s> : S extends `${infer s}${Trash}` ? Trim<s> : S;

解説

先ほどの先頭に加えて後方もやるようにしました。前がOKだったら後ろからも検査するようにしています。

【中級】Capitalize

問題の詳細はこちらです。

問題

文字列の最初の文字を大文字に変換し、それ以外はそのままにする Capitalize<T> を実装します。

例えば

type capitalized = Capitalize<'hello world'> // expected to be 'Hello world'

解答

type MyCapitalize<S extends string> = S extends `${infer T}${infer U}` ? `${Uppercase<T>}${U}` : S;

解説

問題としては優しい部類だったと思いますが、Uppercaseを知らなかったので調べて解答しました。
文字列の先頭を取ってきてそれをUpperCaseで大きくして元に戻しています。
Uppercaseの方を見てみると

type Uppercase<S extends string> = intrinsic;

となっています。intrinsicはコンパイラの内部に書かれた、実装が見えない型に割り振られるキーワードです。

type Lowercase<S extends string> = intrinsic;
type Capitalize<S extends string> = intrinsic;
type Uncapitalize<S extends string> = intrinsic;

この似たような操作として三つも同じ型に指定されています。

10日目

【中級】Replace

問題の詳細はこちらです。

問題

文字列Sに含まれる文字FromをToに一度だけ置き換える型Replace<S, From, To>を実装します。

例えば

type replaced = Replace<'types are fun!', 'fun', 'awesome'>; // expected to be 'types are awesome!'

解答

type Replace<S extends string, From extends string, To extends string> =
  S extends `${infer T}${From}${infer U}`
    ? From extends ''
      ? S
      : `${T}${To}${U}`
    : S;

解説

まず、Fromと一致する文字列が含まれている場合、その最初の位置以前Tと以降Uで分けます。そしてそれをToを真ん中に挟み込むことでFromをToに置き換えた文字列が完成します。問題は空文字列のときで、この場合は何も変えないということなので、そのままSを返すようにしました。

【中級】Replace All

問題の詳細はこちらです。

問題

文字列Sに含まれる部分文字列FromをToに置き換える型ReplaceAll<S, From, To>を実装します。

例えば

type replaced = ReplaceAll<'t y p e s', ' ', ''>; // expected to be 'types'

解答

type ReplaceAll<S extends string, From extends string, To extends string> =
  From extends ''
    ? S
    : S extends `${infer T}${From}${infer V}`
      ? `${T}${To}${ReplaceAll<`${V}`, From, To>}`
      : S;

解説

まず、前の問題と異なり先にFromが''であった場合を先に弾いています。後の再起処理で分岐させるよりも本質とはズレた不要な条件は先に弾いていた方が考慮がなくなるのでそうしました。さてFromが''でなかった時ですが、Fromが含まれているか否かを考えています。Fromが含まれていなければそのまま返すようにしています。Fromが含まれていた場合はTとToを外に出して再起的に置き換えしていきます。TとToを外に出したのはfoobarのような文字列があったときにobをbに置き換えた時にfobarではなく、fbarになるのを避けるためです。つまり検査済みの文字列を再検査させないためというわけです。
お得意の過去の問題を再起的にするだけかと思いましたが、TとToを外に出す処理に学びがありました。

【中級】Append Argument

問題の詳細はこちらです。

問題

与えられた関数型 Fn と任意の型 A に対して、第一引数に Fn を取り、第二引数に A を取り、Fn の引数に A を追加した関数型 G を生成します。

例えば、

type Fn = (a: number, b: string) => number

type Result = AppendArgument<Fn, boolean> 
// expected be (a: number, b: string, x: boolean) => number

解答

type AppendArgument<Fn extends Function, A> =
  Fn extends (...args: infer T) => infer U
    ? (...args: [...T, A]) => U
    : never;

解説

関数の引数と返り値を推論して、引数にAを追加したものを返却します。

11日目

【中級】Permutation

問題の詳細はこちらです。

問題

Union 型を Union 型の値の順列を含む配列に変換する順列型を実装します。

type perm = Permutation<'A' | 'B' | 'C'>; // ['A', 'B', 'C'] | ['A', 'C', 'B'] | ['B', 'A', 'C'] | ['B', 'C', 'A'] | ['C', 'A', 'B'] | ['C', 'B', 'A']

解答

type Permutation<T, K=T> =
    [T] extends [never]
      ? []
      : K extends K
        ? [K, ...Permutation<Exclude<T, K>>]
        : never

解説

難しくて答えられなかったです。このような問題を解けるようになりたいです。
解答に使用したのはこちらのissueで、解説も丁寧に載っていました。
まず最初の部分が[T] extends [never]です。これによってTがneverであることを保証しているようです(T[] extends never[]でも良いです)。ちなみにT extends never ? true : falseはTがneverであってもfalse扱いとなります。これはextendsの仕様のせいです。extendsは例えばT extends Uのような形の時、Tをユニオン型として扱います。これはTが'A'|'B'の時'A' extends U | 'B' extends Uと分けるためです。そのためneverは'a'|neverが'A'となるようにnever|は型なしになってしまうことを考慮するとT extends never ? true : falseはextends neverとなり当てはまるものがなくなるのでfalseになってしまうのです。
続いてK extends Kです。例えば1|2|3をKとすると先ほどの説明を考慮すると1 extends 1|2|3、2 extends 1|2|3、3 extends 1|2|3となります。そしてこの場合確実に含まれるのでそれぞれ[1, ...Permutation<Exclude<T, 1>>]、[2, ...Permutation<Exclude<T, 2>>]、[3, ...Permutation<Exclude<T, 3>>]が呼び出されます。そうして繰り返していくと、、、解答を得ることができます。

【中級】Length of String

問題の詳細はこちらです。

問題

String#length と同じように、文字列リテラルの長さを計算します。

解答

type LengthOfString<S extends string, SArr extends string[] = []> =
  S extends `${infer T}${infer Rest}`
    ? LengthOfString<Rest, [T, ...SArr]>
    : SArr['length'];

解説

配列のようにS['length']で取得はできませんでした。ただ、配列の長さは取得できることを利用して文字列を一文字ずつ配列に埋め込んでできた配列の長さを測ることで解答できると思いました。
配列の作成は文字列の先頭を一つずつ取ってきて、LengthOfStringに追加したSArrを成長させることで実装しています(初期値は空配列です)。最終的に取得できる文字列がなくなったときに、SArrのlenghtを取得して解答しています。

【中級】Flatten

問題の詳細はこちらです。

問題

この課題では、受け取った配列をフラット化した型を出力する型を書く必要があります。

例えば:

type flatten = Flatten<[1, 2, [3, 4], [[[5]]]> // [1, 2, 3, 4, 5]

解答

type Flatten<T extends any[]> =
  T extends [infer U, ...infer V]
    ? U extends any[]
      ? [...Flatten<U>, ...Flatten<V>]
      : [U, ...Flatten<V>]
    : [];

解説

典型的な再起の形でした。
まず、Tの中身があるか確認します。なければ空配列を返しています。あればさらに分岐に進んでいきます。配列の最初の要素を取ってきて、それが配列であればそれを平坦にするため再度Flattenにかけます。そして、残った配列Vの平坦化も必要なのでそっちにもFlattenをかけて、両者の配列を返します。最初の要素が配列でなければこれ以上平坦化できないので、最初の要素と残った配列Vを平坦化したものの配列を返します。

12日目

【中級】Append to Object

問題の詳細はこちらです。

問題

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

例えば、

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

解答

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

解説

TというオブジェクトにUをkey、Vをvalueとして追加する問題です。Uは何かのキーとなるような型としました。Mapped Typesによってオブジェクトを組み直すのですが、keyにはTのキーとUのユニオン型を取ります。そして、valueはPがTのキーの場合はT[P]Uの場合はVを与えるようにしました。

【中級】Absolute

問題の詳細はこちらです。

問題

srting, number または bigint を受け取り、正の数を出力する Absolute 型を実装します。

例えば

type Test = -100;
type Result = Absolute<Test>; // expected to be "100"

解答

type Absolute<T extends number | string | bigint> = `${T}` extends `-${infer U}` ? U : `${T}`;

解説

bigintの扱いがわからなかったのでnumberとstringで動くように作ったところbigintも動きました。まず、Tをstring化します。numberはそのまま、bigintはnumberのように形を変えてstringになります。マイナスを取らなければいけないので-があれば-を取ったもの、マイナスがなければstring化したものをそのまま返します。

【中級】String to Union

問題の詳細はこちらです。

問題

受け取った文字列を Union 型に変換する型を実装します。

例えば

type Test = '123';
type Result = StringToUnion<Test>; // expected to be "1" | "2" | "3"

解答

type StringToUnion<T extends string> = T extends `${infer U}${infer V}` ? U | StringToUnion<V> : never

解説

少し前に解いたTuple to Unionとやっていることはほとんど同じです。あまりに似ていたので問題を間違えたか不安になりました。
先頭から文字を一つずつ取ってきて、それ以降の文字列をさらにStringToUnionを呼び出して両者をユニオン型として取得します。これを繰り返すと完成します。

13日目

【中級】Merge

問題の詳細はこちらです。

問題

2 つの型をマージして新しい型を作ります。2 つ目に指定した型のキーは 1 つ目の型のキーを上書きします。

例えば

type foo = {
  name: string;
  age: string;
}
type coo = {
  age: number;
  sex: string
}

type Result = Merge<foo,coo>; // expected to be {name: string, age: number, sex: string}

解答

type Merge<F, S> = {
  [P in keyof F | keyof S]: P extends keyof S
    ? S[P]
    : P extends keyof F
      ? F[P]
      : never
};

解説

Mapped　TypesでMerge後のオブジェクトを作ります。keyはFとSのキーのユニオンとします。そして、2つ目のキーが一つ目を上書きするという設定から、先にPがSのキーであるか確かめてSのキーだったらS[P]をvalueとします。次に、PがFのキーだったらF[P]をvalueにするようにします。そんなことはないですが、どちらのキーでもなければneverとします。

【中級】KebabCase

問題の詳細はこちらです。

問題

キャメルケースもしくはパスカルケースの文字列を、ケバブケースに置換する方を実装します。

FooBarBaz -> foo-bar-baz

例えば

type FooBarBaz = KebabCase<"FooBarBaz">;
const foobarbaz: FooBarBaz = "foo-bar-baz";

type DoNothing = KebabCase<"do-nothing">;
const doNothing: DoNothing = "do-nothing";

解答

type Repeat<S> = S extends `${infer T}${infer U}`
  ? T extends Capitalize<T>
    ? T extends Uncapitalize<T>
      ? `${T}${Repeat<U>}`
      : `-${Uncapitalize<T>}${Repeat<U>}`
    : `${T}${Repeat<U>}`
  : S;

type KebabCase<S> = S extends `${infer T}${infer U}` ? `${Uncapitalize<T>}${Repeat<U>}` : '';

解説

型Repeatはいい感じの命名ができませんでした。
まずケバブケースにするにあたって二つの場所に分けられます。それはコードからもわかるとおり一文字目とそれ以降です。一文字目は大文字であった場合小文字にするだけですが、二文字目以降は大文字であった場合先頭に-をつけて小文字にする必要があります。そのため、KebabCaseでは一文字目にだけ対応させて二文字目以降はRepeatに操作させます。
KebabCaseでは最初の文字を小文字にして、残りの部分をRepeatに渡しています。Repeatでは先頭文字が大文字でなければそのまま後続の文字をRepeatに渡してループさせます。大文字であればそれが同時に小文字としても扱われないかチェックして、扱われなければ-と小文字にして後続の文字列をRepeatに私てループさせています。

【中級】Diff

問題の詳細はこちらです。

問題

Get an Object that is the difference between O & O1

解答

type Diff<O, O1> = {
  [P in
    | Exclude<keyof O, keyof O1>
    | Exclude<keyof O1, keyof O>]: P extends keyof O
    ? O[P]
    : P extends keyof O1
    ? O1[P]
    : never;
};

解説

問題文が英語で面食らいましたが、難易度としては高くなかったように感じました。
Mapped Typesでオブジェクトを作成しており、keyにはOに含まれないO1のキーとO1に含まれないOのキーのユニオン型を取りました。そしてvalueにはそれぞれを持つOまたはO1から抜き出しました。

14日目

【中級】AnyOf

問題の詳細はこちらです。

問題

Implement Python liked any function in the type system. A type takes the Array and returns true if any element of the Array is true. If the Array is empty, return false.

For example:

type Sample1 = AnyOf<[1, '', false, [], {}]> // expected to be true.
type Sample2 = AnyOf<[0, '', false, [], {}]> // expected to be false.

解答

type Any =  0 | '' | false | undefined | null | [] | {[key: string]: never};
type AnyOf<T extends readonly any[]> = T[number] extends Any ? false : true;

解説

前回の問題から英語ですので今後は英語でしか問題がないのかもしれません。
配列の中身が一つでもtruthy(真)だったらtrueを返すような型です。そのため最初にfalsyな型を定義して、それと同じものだけで構成されていたらfalseが買えるようにしました。

【中級】IsNever

問題の詳細はこちらです。

問題

Implement a type IsNever, which takes input type T. If the type of resolves to never, return true, otherwise false.

For example:

type A = IsNever<never>  // expected to be true
type B = IsNever<undefined> // expected to be false
type C = IsNever<null> // expected to be false
type D = IsNever<[]> // expected to be false
type E = IsNever<number> // expected to be false

解答

type IsNever<T> = T[] extends never[] ? true: false;

解説

以前パーミュテーションを求める話で解説した通りです。[T] extends [never] ? true : falseでも同様に通りますが、T extends never ? true : falseは通りません。これはT extends Uの形が常にユニオン型のように扱うからで、neverをユニオン型としてみるとemptyになるからです。

【中級】IsUnion

問題の詳細はこちらです。

問題

Implement a type IsUnion, which takes an input type T and returns whether T resolves to a union type.

For example:

type case1 = IsUnion<string>  // false
type case2 = IsUnion<string|number>  // true
type case3 = IsUnion<[string|number]>  // false

解答

type IsUnion<T, U=T> =
  T[] extends never[]
  ? false
  : T extends T 
      ? U[] extends T[] 
        ? false 
        : true
      : never;

解説

neverは扱いが大変なので、まず前回同様の方法で検知してfalseを返します。次にT extends Tとすることで、Tがユニオンの場合複数の条件に分離させます。その後、Tの一部はUの一部であるがUはTの一部の一部ではないことを活かして、U[] extends T[]と判定します。で一致すればfalse、一致しなければTがユニオンとしてtrueを返すようにしました。

15日目

【中級】ReplaceKeys

問題の詳細はこちらです。

問題

Implement a type ReplaceKeys, that replace keys in union types, if some type has not this key, just skip replacing, A type takes three arguments.

For example:

type NodeA = {
  type: 'A'
  name: string
  flag: number
}

type NodeB = {
  type: 'B'
  id: number
  flag: number
}

type NodeC = {
  type: 'C'
  name: string
  flag: number
}


type Nodes = NodeA | NodeB | NodeC

type ReplacedNodes = ReplaceKeys<Nodes, 'name' | 'flag', {name: number, flag: string}> // {type: 'A', name: number, flag: string} | {type: 'B', id: number, flag: string} | {type: 'C', name: number, flag: string} // would replace name from string to number, replace flag from number to string.

type ReplacedNotExistKeys = ReplaceKeys<Nodes, 'name', {aa: number}> // {type: 'A', name: never, flag: number} | NodeB | {type: 'C', name: never, flag: number} // would replace name to never

解答

type ReplaceKeys<U, T, Y> = U extends any ? {
  [key in keyof U]:
    key extends T
      ? key extends keyof Y
        ? Y[key]
        : never
      : U[key];
} : never;

解説

問題が長ったらしいですが、解答は簡単でした。まず、お得意の方法U extendsでユニオン型を分割します。Uが何かによって条件分けをする必要がないのでanyとしています。そしてMapped Typesで解答のオブジェクトを作成します。keyは変わらないのでUのキーから構成して、キーがTに含まれていれば、Yからそのキーの値を取得してvalueとします(Yになければneverです)。キーがTに含まれていなければUの値をそのまま返します。

【中級】Remove Index Signature

問題の詳細はこちらです。

問題

Implement RemoveIndexSignature<T> , exclude the index signature from object types.

For example:

type Foo = {
  [key: string]: any;
  foo(): void;
}

type A = RemoveIndexSignature<Foo>  // expected { foo(): void }

解答

type RemoveIndexSignature<T> = {
  [P in keyof T as string extends P
    ? never
    : number extends P
    ? never
    : symbol extends P
    ? never
    : P]: T[P];
};

解説

keyがstring、number、symbolのいずれかだったらneverをキーとし、それ以外だったらそのままPをkeyとしてT[P]をvalueとして返しています。

【中級】Percentage Parser

問題の詳細はこちらです。

問題

Implement PercentageParser. According to the /^(+|-)?(\d*)?(%)?$/ regularity to match T and get three matches.

The structure should be: [plus or minus, number, unit] If it is not captured, the default is an empty string.

For example:

type PString1 = ''
type PString2 = '+85%'
type PString3 = '-85%'
type PString4 = '85%'
type PString5 = '85'

type R1 = PercentageParser<PString1> // expected ['', '', '']
type R2 = PercentageParser<PString2> // expected ["+", "85", "%"]
type R3 = PercentageParser<PString3> // expected ["-", "85", "%"]
type R4 = PercentageParser<PString4> // expected ["", "85", "%"]
type R5 = PercentageParser<PString5> // expected ["", "85", ""]

解答

type Sign = '+' | '-';
type Percentage = '%';
type PercentageParser<A extends string> =
  A extends `${infer T}${Percentage}`
    ? T extends `${infer U}${infer V}`
      ? U extends Sign
        ? [U, V, Percentage] 
        : ['', T, Percentage] 
      : ['', T, Percentage] 
    :  A extends `${infer T}${infer U}`
      ? T extends Sign
        ? [T, U, '']
        : ['', `${T}${U}`, '']
      : ['', '', ''];

解説

まず、+と-のユニオンと%を別で定義します(%は単体なので準備する必要はないです)。そしていい感じに分岐を作ります。順番はPercentageの有無で分岐させ、signの有無でさらに分岐させ、残ってたのを真ん中に入れると言う風にしました。もっと綺麗な方法もありそうですが、他の解答は誤っているものが多く尚且つ綺麗なものはありませんでした。

16日目

【中級】Drop Char

問題の詳細はこちらです。

問題

Drop a specified char from a string.

For example:

type Butterfly = DropChar<' b u t t e r f l y ! ', ' '> // 'butterfly!'

解答

type DropChar<S extends string, C extends string> =
  C extends ''
    ? S
    : S extends `${infer T}${C}${infer U}`
      ? `${T}${DropChar<U, C>}`
      : S;

解説

Cが空文字列である時はそのままSを返して、それ以外の時はちゃんと検査します。まず、SにCが含まれていることを確認し、含まれていなければそのままSを返します。Cが含まれていれば先頭の要素を取得して、それ以前の文字列をTそれ以降の文字列をUとします。TにはCが必ず含まれていないのに対してUは未知数なので、UをDropCharにUを渡して再検査します。そしてTと再検査したUを合成したものを解答としています。UをDropCharで再検査しなければ先頭の要素ひとつのみを消すものになります。

【中級】Minus One

問題の詳細はこちらです。

問題

Given a number (always positive) as a type. Your type should return the number decreased by one.

For example:

type Zero = MinusOne<1> // 0
type FiftyFour = MinusOne<55> // 54

解答

type ParseInt<T extends string> = T extends `${infer Digit extends number}` ? Digit : never
type ReverseString<S extends string> = S extends `${infer First}${infer Rest}` ? `${ReverseString<Rest>}${First}` : ''
type RemoveLeadingZeros<S extends string> = S extends '0' ? S : S extends `${'0'}${infer R}` ? RemoveLeadingZeros<R> : S
type InternalMinusOne<
  S extends string
> = S extends `${infer Digit extends number}${infer Rest}` ?
    Digit extends 0 ?
      `9${InternalMinusOne<Rest>}` :
    `${[9, 0, 1, 2, 3, 4, 5, 6, 7, 8][Digit]}${Rest}`:
  never
type MinusOne<T extends number> = ParseInt<RemoveLeadingZeros<ReverseString<InternalMinusOne<ReverseString<`${T}`>>>>>

解説

久しぶりに解けない問題でした。
初め以下のように解答していました。Tの数だけ配列を追加して行って、最後に配列の長さを返しています。常に一つ後の配列と比較していたので、最後に返す配列の長さは-1されたものとなる分けです。

type MinusOne<T extends number, P extends never[] = []> =
  [never, ...P]['length'] extends T
    ? P['length']
    : MinusOne<T, [never, ...P]>;

しかし、MinusOne<1001>のテストでは
Type instantiation is excessively deep and possibly infinite.となってしましました。ループが深すぎるのが原因ですかね。
解答ではまず、数値を文字列化して逆順にしています。その後、最初の文字列を抜き出してまた数値に戻します。その数値を[9, 0, 1, 2, 3, 4, 5, 6, 7, 8]に対応したものに置き換えます。これによって一番下のくらいの数値を引き算しています。もし、0であれば繰り下がりを考慮しなければならないので次の桁にも同様の操作をします(これは繰り返されます)。さて、これによって引き算ができたので、元の数値順に戻すため再度逆順にします。そしてそれを数値にすれば完了と言いたいところですがその前に、先頭の0を省いています。10などを引いた時に09となることを防ぐためです。これによってMinusOneが完成します。

例 100の場合の操作
100 => '100' => '001' => '901' => '991' => '990' => '099' => '99' => 99

【中級】PickByType

問題の詳細はこちらです。

問題

From T, pick a set of properties whose type are assignable to U.

For Example

type OnlyBoolean = PickByType<{
  name: string
  count: number
  isReadonly: boolean
  isEnable: boolean
}, boolean> // { isReadonly: boolean; isEnable: boolean; }

解答

type PickByType<T, U> = {
  [P in keyof T as U extends T[P] ? P : never]: T[P]
};

解説

Tの値でUと一致するものだけ返すようにしています。

17日目

【中級】StartsWith

問題の詳細はこちらです。

問題

Implement StartsWith<T, U> which takes two exact string types and returns whether T starts with U

For example

type a = StartsWith<'abc', 'ac'> // expected to be false
type b = StartsWith<'abc', 'ab'> // expected to be true
type c = StartsWith<'abc', 'abcd'> // expected to be false

解答

type StartsWith<T extends string, U extends string> = T extends `${U}${any}` ? true : false;

解説

先頭にUがマッチしたらtrueしなかったらfalseを返しました。

【中級】EndsWith

問題の詳細はこちらです。

問題

Implement EndsWith<T, U> which takes two exact string types and returns whether T ends with U

For example:

type a = EndsWith<'abc', 'bc'> // expected to be true
type b = EndsWith<'abc', 'abc'> // expected to be true
type c = EndsWith<'abc', 'd'> // expected to be false

解答

type EndsWith<T extends string, U extends string> = T extends `${any}${U}` ? true : false;

解説

末尾にUがマッチしたらtrueしなかったらfalseを返しました。

【中級】PartialByKeys

問題の詳細はこちらです。

問題

Implement a generic PartialByKeys<T, K> which takes two type argument T and K.

K specify the set of properties of T that should set to be optional. When K is not provided, it should make all properties optional just like the normal Partial<T>.

For example

interface User {
  name: string
  age: number
  address: string
}

type UserPartialName = PartialByKeys<User, 'name'> // { name?:string; age:number; address:string }

解答

type MappedType<T> = {[P in keyof T]: T[P]};
type PartialByKeys<T, K extends keyof T = keyof T> = MappedType<Omit<T,K> & Partial<Pick<T,K>>>;

解説

今日の問題はとても簡単だったのでここで難易度が高い問題が出てきて安心しました。
まず与えられたTをオブジェクトに展開し直すMappedType型を用意します。
次に、Omitを使ってoptional化しないものとPickを使ってoptional化するものを分けて取得します。Pickで抜き取った方はPartialを利用してによってoptional化します。そしてこれらをIntersection Typesにかけます。このままでは綺麗なObjectにならないので、最初に作ったMappedTypeをかけて整形します。最後の整形部分のひと工夫がかなりポイントです。

18日目

【中級】RequiredByKeys

問題の詳細はこちらです。

問題

Implement a generic RequiredByKeys<T, K> which takes two type argument T and K.

K specify the set of properties of T that should set to be required. When K is not provided, it should make all properties required just like the normal Required<T>.

For example

interface User {
  name?: string
  age?: number
  address?: string
}

type UserRequiredName = RequiredByKeys<User, 'name'> // { name: string; age?: number; address?: string }

解答

type MappedType<T> = { [P in keyof T]: T[P] };
type RequiredByKeys<T, K extends keyof T | unknown = keyof T> = MappedType<
  Omit<T, Extract<keyof T, K>> & Required<Pick<T, Extract<keyof T, K>>>
>;

解説

前回の問題PartialByKeysとほとんど同じですね。異なる箇所はKにneverが入る箇所です。その場合Omit<T, K>やPcik<T, K>が機能しないのでExtractでTのkeyだけ取り出しておこないました。RequiredにしないものはK以外のものがキーのTなのでOmitで弾いて、RequiredにするものはKがキーのTなのでPickで取得して、Requiredにしています。それらをInsertsection Typesで取ってオブジェクトを作り直しています。

【中級】Mutable

問題の詳細はこちらです。

問題

Implement the generic Mutable<T> which makes all properties in T mutable (not readonly).

For example

interface Todo {
  readonly title: string
  readonly description: string
  readonly completed: boolean
}

type MutableTodo = Mutable<Todo> // { title: string; description: string; completed: boolean; }

解答

type Mutable<T extends object> = {
  -readonly [P in keyof T]: T[P]
}

解説

とりあえずオブジェクトで動くように作ったところarrayもこれでreadonlyを外せました。その後、stringなどのプリミティブな値ではエラーが起きるようにobjectを受け取るようにしました。
本質を捉えた考察ではないですが、Readonlyの実装は

type Readonly<T> = { readonly [P in keyof T]: T[P]; }

となっているので、これでarrayをreadonlyを変換できるのであれば、上記のMutableもできると考えられます。また、配列はkeyがnumberのオブジェクトと考えればこの操作を行えることも妥当と考えられます。

【中級】OmitByType

問題の詳細はこちらです。

問題

From T, pick a set of properties whose type are not assignable to U.

For Example

type OmitBoolean = OmitByType<{
  name: string
  count: number
  isReadonly: boolean
  isEnable: boolean
}, boolean> // { name: string; count: number }

解答

type OmitByType<T, U> = {
  [P in keyof T as T[P] extends U ? never : P]: T[P]
};

解説

T[P]がUと一致したときのみneverを返して含まれないようにしています。

19日目

【中級】ObjetEntries

問題の詳細はこちらです。

問題

Implement the type version of Object.entries

For example

interface Model {
  name: string;
  age: number;
  locations: string[] | null;
}
type modelEntries = ObjectEntries<Model> // ['name', string] | ['age', number] | ['locations', string[] | null];

解答

type ObjectEntries<T, U = keyof T> = U extends keyof T
  ? [U, T[U] extends infer V | undefined ? V : T[U]]
  : never;

解説

テストケースが個人的には疑問でした(汎化した型を作るという面では良いかもしれないが)。
お得意のextendsでTのキーを分離させます。そして、分離したUをkeyとして、T[U]がvalueとなるような配列を作っておしまいです。valueはテストケースが通るようにいじりました。undefinedと何か他の方のユニオン型の時はundefinedを省いた方を送るようにしています。Partialなオブジェクトのテストケースの対策です。この部分には不満が残りますが、他者の回答も似たようなものか、考慮されていない状態でテストは通らなかったためこのようにしました。

【中級】Shift

問題の詳細はこちらです。

問題

Implement the type version of Array.shift

For example

type Result = Shift<[3, 2, 1]> // [2, 1]

解答

type Shift<T extends readonly any[]> = T extends [any, ...infer U] ? U : [];

解説

これ8日目にやったような気がするんですが、気のせいですかね。
8日目のものを改造しました。readonlyを追加して、あとは空配列が渡った時にneverを返していたので空配列を渡すようにしました。

【中級】Tuple to Nested Object

問題の詳細はこちらです。

問題

Given a tuple type T that only contains string type, and a type U, build an object recursively.

type a = TupleToNestedObject<['a'], string> // {a: string}
type b = TupleToNestedObject<['a', 'b'], number> // {a: {b: number}}
type c = TupleToNestedObject<[], boolean> // boolean. if the tuple is empty, just return the U type

解答

type TupleToNestedObject<T extends any[], U> = T extends [infer V, ...infer W]
  ? V extends string
    ? { [P in V]: TupleToNestedObject<W, U> }
    : never
  : U;

解説

浅い部分から順番に作っていくように作りました。Tから先頭の要素を一枚ずつ剥がしていって、Tが空になるまでTupleToNestedObjectがvalueになるようにしてループさせました。Tが空になったらUを返して終わりにしました。途中にあるV extends stringですが、Mapped Typesを構築するために、Vがユニオンになるように書きました。他の解答を見てみると

type TupleToNestedObject<T extends string[], U> = T extends [
  infer V extends string,
  ...infer W extends string[],
]
  ? { [P in V]: TupleToNestedObject<W, U> }
  : U;

のようにinfer後に行っても問題なくできるようです。

20日目

【中級】Reverse

問題の詳細はこちらです。

問題

Implement the type version of Array.reverse

For example:

type a = Reverse<['a', 'b']> // ['b', 'a']
type b = Reverse<['a', 'b', 'c']> // ['c', 'b', 'a']

解答

type Reverse<T> = T extends [...infer U, infer V] ? [V, ...Reverse<U>] : [];

解説

後ろのものから空になるまで取得して再度配列を作っています。

type Reverse<T> = T extends [infer U, ...infer V] ? [...Reverse<V>, U] : [];

このような解答もあって、確かになと思いました。

【中級】Flip Arguments

問題の詳細はこちらです。

問題

Implement the type version of lodash's _.flip.

Type FlipArguments<T> requires function type T and returns a new function type which has the same return type of T but reversed parameters.

For example:

type Flipped = FlipArguments<(arg0: string, arg1: number, arg2: boolean) => void> 
// (arg0: boolean, arg1: number, arg2: string) => void

解答

type Reverse<T> = T extends [...infer U, infer V] ? [V, ...Reverse<U>] : [];
type FlipArguments<T extends Function> = T extends (...args: infer U) => infer W
  ? (...args: Reverse<U>) => W
  : never;

解説

Reverseの次の問題だったので解きやすかったです。Tから引数を取ってきてそれを反転させたもので関数を作って返しました。

【中級】FlattenDepth

問題の詳細はこちらです。

問題

Recursively flatten array up to depth times.

For example:

type a = FlattenDepth<[1, 2, [3, 4], [[[5]]]], 2> // [1, 2, 3, 4, [5]]. flattern 2 times
type b = FlattenDepth<[1, 2, [3, 4], [[[5]]]]> // [1, 2, 3, 4, [[5]]]. Depth defaults to be 1

If the depth is provided, it's guaranteed to be positive integer.

解答

type FlattenDepth<
  T extends any[],
  U extends number = 1,
  V extends never[] = [],
> = T extends [infer W, ...infer X]
  ? W extends any[]
    ? V['length'] extends U
      ? [W, ...FlattenDepth<X, U, V>]
      : [...FlattenDepth<W, U, [never, ...V]>, ...FlattenDepth<X, U, V>]
    : [W, ...FlattenDepth<X, U, V>]
  : [];

解説

まずTが空配列かどうかチェックしつつ、先頭とそれ以降で分けます。空の時は空配列を返してあげます。次に先頭が配列でなかった場合Flatにしようがないのでそれ以降の配列をFllatenDepthにかけます。配列だった場合は、Vの長さが指定のFlat回数Uと一致しているか確認します。Vは再起する際に渡すFlat数です。すでに指定された回数Flat指定ればそれ以降の配列をFlattenDepthにかけます。まだ足りない場合はVを追加して先頭の要素をFlattenDepthにかけます。同時にそれ以降の配列もFlattenDepthにかけます。これによって最終的にU回Flatされた配列ができます。

21日目

【中級】BEM style string

問題の詳細はこちらです。

問題

The Block, Element, Modifier methodology (BEM) is a popular naming convention for classes in CSS.

For example, the block component would be represented as btn, element that depends upon the block would be represented as btn__price, modifier that changes the style of the block would be represented as btn--big or btn__price--warning.

Implement BEM<B, E, M> which generate string union from these three parameters. Where B is a string literal, E and M are string arrays (can be empty).

解答

type Element<E extends string[]> = E extends [] ? '' : `__${E[number]}`;
type Modifier<M extends string[]> = M extends [] ? '' : `--${M[number]}`;
type BEM<B extends string, E extends string[], M extends string[]> = `${B}${Element<E>}${Modifier<M>}`;

解説

BEMはCSSのネーミング法の一種です。ルールを知らなかったので、別の意味でも勉強になりました。
BEMのBはBlockで要素に対する名前、EはElementでブロックに依存した要素、MはModifierでBlockの変数みたいです。BEMについては本質じゃなく、雰囲気理解なのでちゃんと知りたい場合はドキュメントを読んだ方が良いです。とりあえず、blockが先頭にきてそれに従属する形でElementは__、Modufierは--で繋げて書きます(btn__price--infoなど)。
さて、解答を見ていきます。Bはそのままです。Eは配列が空の時は空文字列を返し、それ以外の時は要素の先頭に__を足したもののユニオンとなります。それを作る部分は上に切り出しました。同様にMも上に切り出しました。EもMも先頭に加えるものが異なるだけで、操作は同じなので、先頭に加えるものを受け取らせる共通の型を作っても良いかも知れません。

type AddLead<T extends string[], S extends '--' | '__'> = T extends [] ? '' : `${S}${T[number]}`;

【中級】InorderTraversal

問題の詳細はこちらです。

問題

Implement the type version of binary tree inorder traversal.

For example:

const tree1 = {
  val: 1,
  left: null,
  right: {
    val: 2,
    left: {
      val: 3,
      left: null,
      right: null,
    },
    right: null,
  },
} as const

type A = InorderTraversal<typeof tree1> // [1, 3, 2]

解答

type InorderTraversal<T extends TreeNode | null> = [T] extends [TreeNode]
  ? [...InorderTraversal<T['left']>, T['val'], ...InorderTraversal<T['right']>]
  : [];

解説

Tがnullになるまで、左右に展開していきました。[T] extends [TreeNode]とした理由はT extends TreeNodeはTがユニオンにされることによって無限ループが発生するからです。

【中級】Flip

問題の詳細はこちらです。

問題

Implement the type of just-flip-object. Examples:

Flip<{ a: "x", b: "y", c: "z" }>; // {x: 'a', y: 'b', z: 'c'}
Flip<{ a: 1, b: 2, c: 3 }>; // {1: 'a', 2: 'b', 3: 'c'}
Flip<{ a: false, b: true }>; // {false: 'a', true: 'b'}

No need to support nested objects and values which cannot be object keys such as arrays

解答

type Flip<T extends Record<any, any>> = { [P in keyof T as `${T[P]}`]: P };

解説

最近あまり見ていなかったので他者の回答を見てみましたが、回答数が20%くらいまで減ってました。解答としてはMapped Typesで逆転させただけです。

22日目

【中級】Fibonacci sequence

問題の詳細はこちらです。

問題

Implement a generic Fibonacci<T> that takes a number T and returns its corresponding Fibonacci number.

The sequence starts: 1, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89, 144, ...

For example

type Result1 = Fibonacci<3> // 2
type Result2 = Fibonacci<8> // 21

解答

type Fibonacci<
  T extends number,
  IdxArray extends never[] = [never],
  Past extends never[] = [],
  Current extends never[] = [never],
> = IdxArray['length'] extends T
  ? Current['length']
  : Fibonacci<T, [...IdxArray, never], Current, [...Past, ...Current]>;

解説

数値を扱う問題はプログラミングとして特には低難度なものでも、型として解くとなるとなかなか良い問題になるなと感じました。この問題は再起的に解きました。1個目、2個目と求めていき、T個目の値を得るようにしています。T個目まで求まったことを確認するために最初にIdxArray['length'] extends Tで確認しています。IdxArrayですが、ループごとにneverを詰めていきループ回数を記録しています。初項がないとも止まらないので最初からneverが一つ入っています。他にPastやCurrentがありますが、Pastは前回の値、Currentは今の値を表しています。Pastは次の値は前回の値と今の値の足し算であることから保存しています。そしてPastやCurrentも見てわかるように配列の長さで管理しています。これは型で数値を扱う時の常套手段です。話がそれましたが、最初にT回目かどうか確認して、T回目だったらCurrentの長さを返して回答、T回目でなければFibonacciをまた呼び出して、TとIdxArrayにneverを一つ追加したものとCurrentをPastに追加します。最後にCurrentとしてPastとCurrentを結合したものを追加します。これで完成です。

【中級】文字の組み合わせ

問題の詳細はこちらです。

問題

指定された文字列に含まれる文字をそれぞれ最大で1度だけ使った文字列のすべての組み合わせの型AllCombinationsを実装します。

例えば

type AllCombinations_ABC = AllCombinations<'ABC'>;
// should be '' | 'A' | 'B' | 'C' | 'AB' | 'AC' | 'BA' | 'BC' | 'CA' | 'CB' | 'ABC' | 'ACB' | 'BAC' | 'BCA' | 'CAB' | 'CBA'

解答

type Str2Union<S extends string, T extends string = ''> = S extends `${infer U}${infer V}` ? Str2Union<V, U | T> : T;
type Combination<T extends string, U = T> = U extends T
  ? U | `${U}${Combination<Exclude<T, U>>}`
  : never;
type AllCombinations<S extends string> = Combination<Str2Union<S>>;

解説

久しぶりに日本語の問題が出てきて嬉しいです。問題としては昔やったような気がして、見返しましたがPermutationでした。とても難しかったです。
まず、文字列を一文字ずつのユニオンに分解する型と、Combinationを行う方を用意します。Combination型はユニオン型を受け取って、解答の通りの方を出力するコアとなっています。まず、U extends TでU(ユニオン型)を単体に分解します。そして、U単体を一つ用意、UとCombinationにTからUを抜いたものを組み合わせたものをユニオン型を取らせます。UとCombinationにTからUを抜いたものはUと何かの組み合わせを新たに作ってくれるので段々文字列の長さが大きいものが作られていきます。これを繰り返していくと最大の長さまでの解答を得られます。

【中級】Greater than

問題の詳細はこちらです。

問題

In This Challenge, You should implement a type GreaterThan<T, U> like T > U

Negative numbers do not need to be considered.

For example

GreaterThan<2, 1> //should be true
GreaterThan<1, 1> //should be false
GreaterThan<10, 100> //should be false
GreaterThan<111, 11> //should be true

Good Luck!

解答

type GreaterThan<T extends number, U extends number, V extends never[] = []> =
  T extends V['length']
    ? false
    : U extends V['length']
      ? true
      : GreaterThan<T, U, [...V, never]>;

解説

Vの長さを大きくしていって先にTと同じ数になった時にfalse、Uと同じ数になった時にtrueを返すようにしました。他者の回答に比べて、かなりシンプルに書けて気に入っています。

23日目

【中級】Zip

問題の詳細はこちらです。

問題

In This Challenge, You should implement a type Zip<T, U>, T and U must be Tuple

type exp = Zip<[1, 2], [true, false]> // expected to be [[1, true], [2, false]]

解答

type Zip<T extends any[], U extends any[]> =
  T extends [infer V, ...infer W]
    ? U extends [infer X, ...infer Y]
      ? [[V, X], ...Zip<W, Y>]
      : []
    : [];

解説

TとUから一つずつ取ってきて、セットにしたものを配列に詰め込んでいます。どちらかが空になったら終了させています。

【中級】IsTuple

問題の詳細はこちらです。

問題

Implement a type IsTuple, which takes an input type T and returns whether T is tuple type.

For example:

type case1 = IsTuple<[number]> // true
type case2 = IsTuple<readonly [number]> // true
type case3 = IsTuple<number[]> // false

解答

type IsTuple<T> = 
  T[] extends never[]
    ? false
    : T extends readonly []
      ? true
      : T extends readonly [any, ...any]
        ? true 
        : false;

解説

まず、neverを弾きます。次に空配列またはTの最初の値を取れたらtrueを返すようにします。取れなかったらfalseです。
number[]などは[any, ...any]のように分解できないことを生かして解きました。このやり方ではなく、lengthを取得できるか？でやっているものもありました。

【中級】Chunk

問題の詳細はこちらです。

問題

Do you know lodash? Chunk is a very useful function in it, now let's implement it. Chunk<T, N> accepts two required type parameters, the T must be a tuple, and the N must be an integer >=1

type exp1 = Chunk<[1, 2, 3], 2> // expected to be [[1, 2], [3]]
type exp2 = Chunk<[1, 2, 3], 4> // expected to be [[1, 2, 3]]
type exp3 = Chunk<[1, 2, 3], 1> // expected to be [[1], [2], [3]]

解答

type Chunk<
  T extends any[],
  N extends number,
  U extends any[] = [],
  V extends any[] = []
> = T extends [infer X, ...infer Rest]
  ? [...U, X]["length"] extends N
    ? Chunk<Rest, N, [], [...V, [...U, X]]>
    : Chunk<Rest, N, [...U, X], V>
  : U extends []
    ? V
    : [...V, U];

解説

引数の説明からです。Tはまだ触れていない値の配列、Nは分離する個数、Uは現在作成中の配列、Vは現段階の答えです。最初に先頭と残りの値を取りつつTが空であるか確認します。Tが空の場合捜索を終了ですので終了条件を書きます。現在作成中の配列が空であればVを空でなければVにUを加えたものを返します。続いて、Tが空でない場合です。Uに先頭のXを加えた配列の長さがNであればそこでUが完成するので、次に渡すUの値を空、Vに渡す値をUにXを加えたものをVに加えたものを渡します。Uに先頭のXを加えた配列がNに満たなければUを成長させるために、UにXを加えたものをUに渡して次の機会を待つようにしました。

24日目

【中級】Fill

問題の詳細はこちらです。

問題

Fill, a common JavaScript function, now let us implement it with types. Fill<T, N, Start?, End?>, as you can see,Fill accepts four types of parameters, of which T and N are required parameters, and Start and End are optional parameters. The requirements for these parameters are: T must be a tuple, N can be any type of value, Start and End must be integers greater than or equal to 0.

type exp = Fill<[1, 2, 3], 0> // expected to be [0, 0, 0]

In order to simulate the real function, the test may contain some boundary conditions, I hope you can enjoy it :)

解答

type Fill<
  T extends unknown[],
  N,
  Start extends number = 0,
  End extends number = T['length'],
  IndexArray extends 1[] = [],
  FillFlag extends boolean = false
> = 
  T extends [infer F, ...infer R]
    ? IndexArray['length'] extends Start 
      ? Start extends End 
        ? [F, ...Fill<R, N, Start, End, [1, ...IndexArray]>]
        : [N, ...Fill<R, N, Start, End, [1, ...IndexArray], true>]
      : IndexArray['length'] extends End
        ? [F, ...Fill<R, N, Start, End, [1, ...IndexArray], false>]
        : [FillFlag extends true ? N : F, ...Fill<R, N, Start, End, [1, ...IndexArray], FillFlag>]
    : []

解説

すごい簡単そうなんですけど、久しぶりに解けませんでした。解答には一番シンプルそうなものを貼りました。StartとEndの間どうしようと思ってたんですけど、単純にフラグ持たせれば良いだけでしたね。

【中級】Trim Right

問題の詳細はこちらです。

問題

Implement TrimRight<T> which takes an exact string type and returns a new string with the whitespace ending removed.

For example:

type Trimed = TrimRight<'   Hello World    '> // expected to be '   Hello World'

解答

type TrimTarget = ' ' | '\n' | '\t'
type TrimRight<S extends string> = S extends `${infer Rest}${TrimTarget}` ? TrimRight<Rest> : S;

解説

前に解いた気がしますが、Trimするものを定義して、右側になくなるまでループし続けます。なくなったらそれを解答として返します。

【中級】Without

問題の詳細はこちらです。

問題

Implement the type version of Lodash.without, Without<T, U> takes an Array T, number or array U and returns an Array without the elements of U.

type Res = Without<[1, 2], 1>; // expected to be [2]
type Res1 = Without<[1, 2, 4, 1, 5], [1, 2]>; // expected to be [4, 5]
type Res2 = Without<[2, 3, 2, 3, 2, 3, 2, 3], [2, 3]>; // expected to be []

解答

type Without<T extends number[], U extends number[] | number, Result extends number[] = []> =
  T extends [infer V extends number, ...infer Rest extends number[]]
    ? U extends number[] 
      ? V extends U[number]
        ? Without<Rest, U, Result>
        : Without<Rest, U, [...Result, V]>
      : V extends U
        ? Without<Rest, U, Result>
        : Without<Rest, U, [...Result, V]>
    : Result;

解説

Resultを最初に定義して、配列を一つずつ見ていきます。Uに含まれていなければResultに追加、含まれていなければResultに追加しないようにします。Uはnumberとnumber[]の可能性があるので分岐させました。

25

【中級】Trunc

問題の詳細はこちらです。

問題

Implement the type version of Math.trunc, which takes string or number and returns the integer part of a number by removing any fractional digits.

For example:

type A = Trunc<12.34> // 12

解答

type Trunc<T extends string | number> = `${T}` extends `${infer U}.${any}` ? U : `${T}`;

解説

.があったらそれより右を返します。なければstringにして返します。

【中級】indexOf

問題の詳細はこちらです。

問題

Implement the type version of Array.indexOf, indexOf<T, U> takes an Array T, any U and returns the index of the first U in Array T.

type Res = IndexOf<[1, 2, 3], 2>; // expected to be 1
type Res1 = IndexOf<[2,6, 3,8,4,1,7, 3,9], 3>; // expected to be 2
type Res2 = IndexOf<[0, 0, 0], 2>; // expected to be -1

解答

import type { Equal, Expect } from '@type-challenges/utils'
type IndexOf<T, U, IndexArr extends never[] = []> =
  T extends [infer V, ...infer Rest]
    ? Equal<U, V> extends true
      ? IndexArr['length']
      : IndexOf<Rest, U, [...IndexArr, never]>
    : -1;