4
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

inferという型があります。
どうやって使っていいのかいまいち理解できていないので使える(読める)ようになるため理解を深めたいと思います!

読んだ人がinfer型を理解して明日からわかることを目指して記事を書きます!

infer型とは?

条件付の型(Conditional Types)のextendsの中で利用でき、推論される型を抽出できます。

は?って感じですよね…僕も同じ気持ちでした…。
具体例を見ていきます。

infer型はどのようなものか?

コードの例をサバイバルTypeScriptからコードを借りてきました。

type Flatten<T> = T extends (infer U)[] ? U : never;

上記のコードを分解していきます!

inferを利用して配列であるかどうかを確認します
(infer U)[]
extendsを利用してT型に含まれる型をチェックします
T extends
条件がtrueならU型、falseならneverを返します
条件 ? U : never;

よってサンプルコードはT型が配列であれば配列の中の型を返し、そうでなければnever型を返すFlatten<T>が定義されています!

extendsを利用した「Conditional Types」の中で利用して型の制限をかけるために利用される型のようです!

infer型の使いどころ

下記の記事に書かれていた表現が一番しっくりきました!

  • 何かの型を持つ配列
  • 何かの型でfulfillされるPromise
  • 何かの型のプロパティ"abc"を持つオブジェクト

の何かの型を取得したい場合に必要なのがinfer型。

まとめ

infer型の理解度はいかがでしょうか?
個人的にはかなりスッキリしました!

ただ、本当に使う日は来るのか…とは思いますがライブラリなどの型定義を読む際には役立つのではないかと思っています!

  • infer型はextends「Conditional Types」の中で利用する
  • ある型の中に含まれる型を抽出するために利用できる

おまけ

Type-Challengesをやっていて面白い記述に出会いました。
infer型を使うとこんなことができるのか…と思ったので共有です!

問題と被ってはいけないので少しだけコードを変えてます。

type test = 'hoge'

type StringToUnion<T extends string> = T extends `${infer F}${infer R}`
  ? F | R : never;

type Test = StringToUnion<test>

上記の結果はtype Test = "h" | "oge"になります。

ここで文字列をユニオン型に変換
<T extends string>
1文字目がF、それ以降がRに入る
`${infer F}${infer R}`
最終的に「h」と「oge」が分割されたユニオン型になる
type Test = "h" | "oge"

正直全てを理解できてないですが、こんなことができるのか…と覚えておきたいと思いました。

参考にした記事

4
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?