created: 2022-01-07T08:30:22.000Z

TypeScriptでパッケージ(JQueryDataTable)がexportしていない型を使う

jQueryDataTable を使っているのだが、公式の型定義はexportしている型があまりない。

DefinitelyTyped/index.d.ts at master · DefinitelyTyped/DefinitelyTyped

このパッケージはオプションでいろいろな設定ができるようになっているのだが、色々できるだけあって複雑で、そのオプションの引数の型を調べるのにドキュメントとにらめっこする羽目になっている。オプションの引数の型定義が得られればその手間もなくなって嬉しい。

やりかた

このようにすると、オプションの引数の型定義を取り出すことができた。

import jQueryDataTable from "datatables.net";
type DataTableSettings = ConstructorParameters<typeof jQueryDataTable>[0]

わかりやすく分解するとこうなる。

import jQueryDataTable from "datatables.net";
// 値であるjQueryDataTableの型定義を取り出す
type DataTableConstructor = typeof jQueryDataTable;
// jQueryDataTableはコンストラクタなので、newに対する引数の型定義を取り出す
type DataTableConstructorParameter = ConstructorParameters<DataTableConstructor>;
// ConstructorParameters は引数の配列型で返るので、コンストラクタの1つ目の引数の型定義を取り出す
type DataTableSettings = DataTableConstructorParameter[0]

調子に乗る

調子に乗ってカラムの型も取り出すとこうなる。

export type DataTableSettings = NonNullable<DataTableSettingsArgs>;
export type T = NonNullable<DataTableSettings["columns"]>;
export type DataTableColumnSetting = T;

NonNullable とカラム名を指定した型の取得をする。

TypeScriptでパッケージ(JQueryDataTable)がexportしていない型を使う

やりかた

調子に乗る

参考