TypeScriptで関数の戻り値の型を利用する

久々に小ネタ的な備忘。

タイトルの答えは以下です。

const func = () => { ... };
type FuncReturnType = ReturnType<typeof func>;

ただし、 ReturnType が使えるのは TypeScript 2.8からです。

以下は雑記です。

ライブラリのFactory関数の戻り値に型をつけたい

最近、個人開発でTypeScript + Vue.jsをよく書いています。
そのなかで、PiniaというStoreライブラリを使っているのですが、Storeの生成が以下のような、Storeを返す関数を生成する関数になっています。

const useStore = defineStore({
  state: { ... },
  getters: { ... },
  actions: { ... }
});

// 使いたいときは関数を呼び出す
const store = useStore();

生成した関数の引数に渡したりしたいとなったときに、型をつけたくなったのですが、自分でInterfaceを書くのはかなり面倒です。

そこで調べたところ、Utility Typesに ReturnType<Type> が存在しており、これを使えば解決することがわかりました。

つまり、

const useStore = defineStore({ ... });

type StoreType = ReturnType<typeof useStore>;

とすることで、Storeの型を簡単につけることができました。

関数の戻り値の型を使いたいときは、 ReturnType<Type> を利用する。